点击“修改”以触发“编辑”操作:
{{#link-to "pages.show" page class="list-group-item"}}
{{page.name}}
<span class="badge" {{action "edit" page preventDefault=false}}>edit</span>
{{/link-to}}
然后触发操作(例如打开编辑页面),但是在下一秒,链接重定向完成,所以我最终选择了“pages.show”路线。 / p>
预期:仅调用“编辑”操作,并且点击事件(?)不会“冒泡”到链接到帮助者。
附注使用Ember 2.2,上面的模板是组件的一部分。
PS:我认为在操作中使用 preventDefault = false 可以阻止这种行为 - 但很明显,链接帮助器从其他地方获取信息。
答案 0 :(得分:7)
您需要的是event bubbling
。您可以在bubbles=false
帮助中使用action
停用它,这样您的点击事件就不会冒泡到link-to
元素
{{#link-to "pages.show" page class="list-group-item"}}
{{page.name}}
<span class="badge" {{action "edit" page bubbles=false}}>edit</span>
{{/link-to}}
http://emberjs.com/api/classes/Ember.Templates.helpers.html#toc_event-propagation
preventDefault
是另一回事,将preventDefault
设置为false时,您允许DOM事件的默认浏览器操作。