3

在下面的代码中，我的单击事件委托和视图层次结构中的所有三个“单击”处理程序都会被触发。

但是，我也想在我的整个视图层次结构中触发“编辑” 。“编辑”只是我的“子”视图中元素的目标。

模板

<script type="text/x-handlebars">
  {{#view App.GrandparentView}}
    {{#view App.ParentView}}
        {{#view App.ChildView}}
           <span {{action "edit" target="view"}}>Click Me</span>
        {{/view}}    
    {{/view}}
  {{/view}}
</script>

​JavaScript 

App.GrandparentView = Ember.View.extend({
  click: function() {
    console.log('Grandparent Click Fired!');
  },
  edit: function () {
   console.log('GrandParent edit fired');        
  }
});
App.ParentView = Ember.View.extend({
  click: function() {
    console.log('Parent Click Fired!');
  },
  edit: function () {
    console.log('Parent edit fired');        
  }

});
App.ChildView = Ember.View.extend({
  click: function() {
    console.log('Child Click Fired!');
  },
  edit: function () {
    console.log('Child edit fired');        
  }

});​

有没有办法委派视图层次结构中的目标处理程序？我不想做的是：

App.ChildView = Ember.View.extend({
  click: function() {
    console.log('Child Click Fired!');
  },
  edit: function () {
    console.log('Child edit fired');        
    this.get('parentView').edit(); //DO NOT WANT TO DO THIS.
  }
});​

这是一个jsFiddle作为测试的示例。

4

1 回答 1

2

看起来与您大约一周前发布的问题相同。据我所知，ember 中没有实现这样的功能。事件传播到视图层次结构，但操作名称丢失，并click触发默认处理程序。

我发现的唯一解决方法是重新打开 Ember.View 类本身，并像这样覆盖点击处理程序：

Ember.View.reopen({
  click: function(event){
    if(event.view !== this && this[event.actionName]){
        return this[event.actionName](event);
    }
  }
})

在这里看小提琴：

http://jsfiddle.net/Sly7/zZyCS/

于 2012-10-23T15:32:00.133 回答