Question

Ember：1.13.2

我似乎无法使其发挥作用。

父/子窗口小部件（gridster-container / gridster-widget）

{{#gridster-container}}
    {{#each model as |widget|}}
        {{#gridster-widget sizeX=widget.sizeX sizeY=widget.sizeY action="addWidget"}}

           ...

        {{/gridster-widget}}
    {{/each}}
{{/gridster-container}}

gridster-插件

export default Ember.Component.extend({
  tagName : 'li',
  sizeX : 1,
  sizeY : 1,

  widget : null,

  didInsertElement : function() {
    var sizeX = this.get('sizeX');
    var sizeY = this.get('sizeY');
        //this.get('parentView').addWidget(this, sizeX, sizeY);
    //this.send('addWidget', this, sizeX, sizeY);
    //this.sendAction('action', this, sizeX, sizeY);
    //this.attrs.action(this, sizeX, sizeY);
    //this.get('gridsterContainer').send('addWidget', this, sizeX, sizeY);
    //this.action(this, sizeX, sizeY);
    this.sendAction('action', this, sizeX, sizeY); //I can see this executing in the debugger.
    }

});

在gridster-container组件中，我有以下操作来捕获操作。

  actions : {
    addWidget : function(widget, sizeX, sizeY) {
      alert('worked'); //This is never called
    }
  },

但是从不调用该动作。

Answer 1

当您屈服时，您需要传递parentView，以便您的模板变为：

{{#gridster-container as |gridsterContainer|}}
    {{#each model as |widget|}}
        {{#gridster-widget parentView=gridsterContainer sizeX=widget.sizeX sizeY=widget.sizeY action="addWidget"}}

           ...

        {{/gridster-widget}}
    {{/each}}
{{/gridster-container}}

或者将gridster-widget移动到gridster-container.hbs然后你必须传递模型{{#gridster-container widgets=model}}并循环它们。

Answer 2

我无法对@ Kitler的答案发表评论，但这个语法对我有用，使用了ember 1.13.4：

{{#gridster-container as |gridsterContainer|}}
    {{#each model as |widget|}}
        {{#gridster-widget targetObject=gridsterContainer sizeX=widget.sizeX sizeY=widget.sizeY action="addWidget"}}

            ...

        {{/gridster-widget}}
    {{/each}}
{{/gridster-container}}

（targetObject代替parentView）

与他们的答案一样，这假定您的gridster-container.hbs包含{{yield this}}。

从子组件发送操作并将其捕获到父组件中

2 个答案: