Question

我尝试扩展一个组件（https://github.com/ember-addons/ember-forms），以便可以在表单控件旁边添加额外的按钮。

想法

开发人员将一个额外的属性传递给组件，并且部分将在窗体控件（input，select，textarea）旁边呈现。

问题

它工作正常，但如果我有部分行动，行动就不会开火。

JsBin

这是一个简化的JsBin，用于演示问题：http://jsbin.com/pexolude/105/edit

HTML

  <script type="text/x-handlebars">
    <h2>Component test</h2>

    {{outlet}}
  </script>

  <script type="text/x-handlebars" data-template-name="index">
  {{booh-whaa partial="somebutton"}}
  <h3>This partial's action works</h3>
  {{partial "somebutton"}}
  </script>

   <script type="text/x-handlebars" data-template-name='_somebutton'>
  <button {{action "booh"}} >Hit me!</button>
</script>

     <script type="text/x-handlebars" data-template-name='components/booh-whaa'>
  <h3>This is my component</h3>
  {{partial partial}}
</script>

JS。

App = Ember.Application.create();

App.IndexController = Ember.Controller.extend({
  selectedCategory:null,
  actions: {
    booh: function() {
      alert("booh!");
    } 
  }
});

App.BoohWhaaComponent = Ember.Component.extend({

});

Answer 1

在组件内部触发操作时，该组件将处理该操作。如果您希望它继续，请使用this.sendAction('action')，然后使用您的组件集{{booh-whaa action='booh'}}。有关组件中操作的更多信息，请参阅guides。

这是一个有效的jsbin。

此外，partials不再需要下划线。

Answer 2

正如Knownasilya所说，默认情况下，组件内部的操作由组件处理。但是，如果您在操作助手上指定了目标，则该操作会自动传播，您不必使用sendAction()。

在您的情况下，这很简单：

{{action 'booh' target='controller'}}

或者如果操作在路线的视图中：

{{action 'booh' target='parentView'}}

另一种选择是使用Em.TargetActionSupport向整个应用中的特定目标发送带有上下文和其他参数的操作。

Ember Js的部分动作不会在组件中触发

2 个答案: