Ember：当单击其中的动作时，阻止链接触发 [英] Ember: prevent link-to from firing when an action within it is clicked

问题描述

我有一个表，我希望用户在点击一行时导航到特定的项目，但该行可能包含其他触发操作的元素（例如复选框），但是不触发器导航（认为gmail）。

I have a table where I want users to navigate to specific items when they click a row, but the row may contain other elements (such as checkboxes) that trigger actions but do not trigger navigation (think gmail).

我的结构如下：

{{#each player in controller}}
  {{#link-to "player" player.uid tagName="tr"}}
    <td>
       {{input action="select" type="checkbox" checked=selected bubbles=false}}
    </td>
    <td>
      {{player.name}}
    </td>
    ...
  {{/link-to}}
{{/each}}

我的问题是鄙视 bubbles = false （如 spec ）， link-to 触发并导航到另一个路由。任何想法？

My problem is that despise the bubbles=false (as indicated in the spec), the link-to fires and a navigate to another route. Any ideas?

推荐答案

当您将操作附加到元素时，输入帮助器不支持 action ='foo'以这种方式。它甚至没有被击中。

That works when you attach an action to an element, the input helper doesn't support action='foo' in that manner. It isn't even being hit at all.

http://emberjs.jsbin.com/lugatite/1/edit

你需要滚动你自己的复选框，或只是观察控制器中的检查值

You'll need to roll you're own checkbox, or just observe the checked value in your controller

App.MyCheckBox = Ember.Checkbox.extend(Ember.TargetActionSupport, {
    target: Ember.computed.alias('controller'),
    action: 'save',
    actionContext: Ember.computed.alias('context'),
    click: function(el) {
      this.triggerAction(); 
      el.stopPropagation();

    }
});

http://jsbin.com/lugatite/5/edit

这篇关于Ember：当单击其中的动作时，阻止链接触发的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！