javascript - 你如何识别点击事件 ember.js 的调用者

Question

我是 ember.js 的新手，想知道您将如何识别哪个 div 创建了点击事件。

index.html

------------旧代码------------------------

 {{#each App.menuController}} 
     {{#view App.menuClickable}}
        <div id={{bindAttr id="idTagName"}}>
           {{title}}
        </div>
     {{/view}}
 {{/each}}

------------更新代码--------------------

 {{#each App.menuController}} 
        <div id={{bindAttr id="idTagName"}} {{action selectMenuItem target="App.menuClickable"}}>
           {{title}}
        </div>
 {{/each}}

应用程序.js

App.MenuOption = Ember.Object.extend({
    title: null,
    idName: null
});

App.menuController = Ember.ArrayController.create({
   content:[],
   init : function() 
   {
        // create an instance of the Song model
        for(var i=0; i<menuOptions.length; i++) {
            console.debug(menuOptions[i]);
            this.pushObject(menuOptions[i]);
        }

   },
   click: function(e)
   {
     alert("here");  
   }
});


App.menuClickable = Ember.View.extend({
  click: function(evt) {
    alert("ClickableView was clicked!");
    console.debug(evt);
  },
  classNames: ['navButton'],
  selectMenuItem: function()
  {
    alert("selected Menu clicked");
  }
});

如您所见，这将打印出几个具有不同标签名称的 div。我想将一个 onclick Action 事件关联到每个 div。

环顾四周似乎有两种方式:

1. 像我一样创建一个 View 并覆盖点击功能(e){}。但是，如果我得到这条路线，我不确定如何区分不同的 div 和触发它的原因。我可以查看事件的属性 (target->attribute->Id)，但我觉得应该有更简洁的方法

2. 使用操作 {{action click "idTagName"}}。但是，我在 App.menuClickable 中执行此操作时遇到问题。它没有被触发，我不确定为什么。我收到以下错误:

   错误:没有处理事件“点击”。 throw new Error("Nothing handled the event '"+ name + "'.");

我以为您会像我在 App.menuClickable 中那样实现点击操作。还有其他地方应该实现吗？

Answer 1

{{action selectMenuItem "idTagName"}} 方法是这里的方法。默认情况下，{{action}} 助手将在 Controller 的 actions 哈希中查找 selectMenuItem 函数。如果未找到，它将被发送到路由器，路由器将检查当前路由和任何父路由在路由的 actions 哈希中的 selectMenuItem 函数。

如果你想在 View 上触发一个函数，将它指定为一个目标，如 {{action selectMenuItem "idTagName"target="view"}}