我有这个代码,当单击图标编辑范围时,它会触发一个打开模态的动作,但同时,单击会传播到它下面的视图(personView)。我希望动作执行并停止传播。
我能想到的唯一解决方案是使图标编辑自己的视图并通过在方法点击中返回false来停止点击传播。没有其他观点,还有其他方法可以做到这一点吗?
HBS:
{{#view Blocks.PersonView}}
<span class="inline pull-right icon-edit" {{action 'modalOpen' 'modifyPersonPopup' 'modifyPerson' this}}></span>
<p class="inline pull-left person-name">{{firstNameDelayed}}</p>
{{/view}}
您还可以将bubbles=false
参数添加到action
标记中。有关如何配置事件传播,请参阅API documentation。
尝试修改操作:
modalOpen: function {
//code of your action
return false;
}
在类似的情况下,这对我有用
我能够使用jQuery拦截点击,但逻辑太糟糕了。此逻辑还会阻止操作助手工作。我宁愿继续使用使用ember视图的解决方案来传播点击。
人物内部令人讨厌的解决方案:
Blocks.PersonView = Ember.View.extend({
classNames: ['event-person-block', 'person', 'inline'],
classNameBindings: ['personActive'],
// Onclick toggles person selection.
click: function () {
this.get('controller.parentController').send('personClicked',this.get('controller.content.id'))
}
didInsertElement: function() {
this.$().find(".icon-edit").click(function(e) {
e.stopPropagation()
})
}
})
使用包含图标编辑范围的视图的清洁解决方案:
Blocks.EditPersonIcon = Ember.View.extend({
click: function () {
return false
}
})