Why do Ember view customEvents only pass one parameter? - ember.js

Question

I am using the twitter typeahead lib, and it can send custom events. One such event is "typeahead:selected" which is documented to pass 3 parameters to the event handler.
To catch that event in Ember, I first do this:
App = Ember.Application.create({
customEvents: {
"typeahead:selected": "onTypeaheadSelected"
}
})
and in a view, I do this:
TypeaheadTextField: Ember.TextField.extend({
onTypeaheadSelected: function(a,b,c) {
console.log("onTypeaheadSelected", arguments, a, b, c);
},
})
But only the first parameter has been set by ember, which is the jQuery event object. Params "b" and "c" are undefined.
If I instead try and listen directly on the events via jQuery using this code in my view:
didInsertElement: function () {
this.$().typeahead().on('typeahead:selected', function(a,b,c) {
console.log("onTypeaheadSelected", arguments, a, b, c);
});
}
I am getting all of "a", "b" and "c" with values, so typeahead is actually sending them.
This is ember 1.5.0.

Answer 1

The general implementation of event callbacks is to pass back SomeCustomEvent arg which contains all of the arguments for the event. They programmed the customEvent handler around this concept (probably short-sighted, unless there is some document out there stating it's the law of the land). https://developer.mozilla.org/en-US/docs/Web/Events
That being said, you'll need to implement it at the view layer like you did. You can create a mixin, or base class (which is essentially the same thing) so you don't need to recreate the code over and over.
App.TypeAheadView = Em.View.extend({
setupTypeAhead: function () {
this.$().typeahead().on('typeahead:selected', this.typeAhead);
}.on('didInsertElement'),
killTypeAhead: function(){
this.$().typeahead().off('typeahead:selected', this.typeAhead);
}.on('willDestroyElement'),
typeAhead:function(a,b,c) {
console.log("onTypeaheadSelected", arguments, a, b, c);
}
});
App.BlahView = App.TypeAheadView.extend();
App.CowView = App.TypeAheadView.extend();