在ember中获取动作目标元素

时间:2013-09-16 17:33:16

标签: ember.js

如何获取触发click事件的目标元素的对象。例如,如果我有一个类似的模板:

<table>
<tr>
    <th {{action "someAction"}} >Type</th>
</tr>
</table>

在我的控制器中我有相应的动作定义如下:

action:{
    someAction : function(){
        //get the th element object 
    }
}

似乎没有传递事件对象,因为我已经尝试了

action:{
    someAction : function(event){
        //event is undefined!
    }
}

更新: 谢谢Márcio和Jeremy。我现在有了一个有效的解决方案。 我的模板看起来像:

<thead>
        {{#view AS.MyView sortBy="value"}}Value{{/view}}
</thead>

我的观点如下:

AS.MyView = Ember.View.extend({
attributeBindings: ['sortBy'],
classNames: ['sortable'],
tagName: 'th',
click: function(evt) {
    var target = evt.target, self = this;
    this.get('controller').send('setSort',$(target).attr('sortBy'));

    $(target).parent().find('th').removeClass('desc').removeClass('asc');
    $(target).addClass(self.get('controller.sortAscending')?'asc':'desc');
}
});

1 个答案:

答案 0 :(得分:2)

classNameBinding是此用例的绝佳选择。

仅供参考,如果您需要处理低级浏览器事件,可以在View图层中执行此操作。

http://emberjs.com/guides/views/handling-events/

{{#view App.ClickableView}}
This is a clickable area!
{{/view}}

App.ClickableView = Ember.View.extend({
  click: function(evt) {
    alert("ClickableView was clicked!");
  }
});