如何阻止内部动作冒泡到外部 link-to helper？

Question

当点击"edit"触发动作"edit":

  {{#link-to "pages.show" page class="list-group-item"}}
    {{page.name}}
    <span class="badge" {{action "edit" page preventDefault=false}}>edit</span>
  {{/link-to}}

然后动作被触发（例如编辑页面被打开），但在下一秒 link-to 重定向完成所以我结束了"pages.show" 路线。

预期：仅调用操作 "edit" 并且点击事件（？）不是 "bubbled" 到 link-to帮手.

旁注 Ember 使用 2.2，上面的模板是组件的一部分。

PS：我认为在动作中使用 preventDefault=false 会阻止此类行为 - 但显然 link-to 助手会得到来自其他地方的信息。

Answer 1

你需要的是event bubbling。您可以在 action 帮助程序中使用 bubbles=false 来禁用它，这样您的点击事件就不会冒泡到 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 事件的默认浏览器操作。

如何阻止内部动作冒泡到外部 link-to helper？

How to stop the inner action from bubbling to the outer link-to helper?

ember.js

ember-cli

htmlbars