Ember - 将html元素作为参数从ember模板传递到组件上的click操作

时间:2016-06-25 13:52:40

标签: ember.js

我们如何在车把的onclick动作中传递元素对象。我试过传递this,但这不起作用。

<a href="javascript:void(0)" onclick={{action "menuClickEvent" this}}>Menu Item</a>

Component.js

Ember.Component.extend({
  actions: {
    menuClickEvent: function(element) {          
      // need element <a> to do jquery operation
    }
  }
});

2 个答案:

答案 0 :(得分:1)

您可以使用ember.js提供的常规click方法:

<a>Menu Item</a>

<强> component.js

export default Ember.Component.extend({
  click(event) {
    console.log(event.target);
  }
});

但是,我经常认为你不应该直接在ember.js中使用DOM元素。我认为您可以以不同且更好的方式解决原始问题,因此您无需直接访问底层DOM元素。

答案 1 :(得分:1)

你不需要通过它。元素可作为事件target属性访问。

<a onclick={{action "menuClickEvent"}}>Menu Item</a>

通过this传递当前component。所以只需从代码中删除此参数即可。您可以删除此javascript:void(0) 90&#39;事情。 href参数在HTML5中是可选的,因此您也可以将其删除。

Ember.Component.extend({
  actions: {
    menuClickEvent: function(e) {          
      console.log(e.target); // here you go with the `a` element for your black ops
    }
  }
});

您可能会想到一个比menuClickEvent更好的名字。