Question

我有一个模板campaign-target.hbs定义如下：

<Some campaign-target.hbs stuff removed for clarity>

{{#campaign-panel-group}}

    {{campaign-panel-wrapper
        closeOtherPanels=(action "closePanels")
        <other params removed for clarity>
    }}

    {{campaign-panel-wrapper
        closeOtherPanels=(action "closePanels")
        <other params removed for clarity>
    }}

{{/campaign-panel-group}}

我希望closeOtherPanels关闭操作引用组件campaign-panel-group中的操作。根据上面的定义，它会尝试在campaign-target中找到该操作。如何引用campaign-panel-group中的操作，而无需将campaign-panel-wrapper引用放入campaign-panel-group.hbs？

非常感谢提前！

Answer 1

您甚至可以像其他参数一样产生闭包动作。 twiddle link

模板/组件/广告活动面板group.hbs
它应该产生关闭行动。

{{yield (action 'closePanels')}}

组件/广告活动面板group.js
定义你的功能

import Ember from 'ember';
export default Ember.Component.extend({
  actions:{
    closePanels(){
      console.log('closePanels in campaign-panel-group');
    }
  }
});

application.hbs
您可以访问已生成的变量并传递给campaign-panel-wrapper组件。

{{#campaign-panel-group as | closePanels |  }}
        {{campaign-panel-wrapper
        closeOtherPanels=closePanels
    }}
{{/campaign-panel-group}}

模板/组件/广告活动面板wrapper.hbs
您可以将该闭包操作用于操作助手。

<button {{action closeOtherPanels}}>campaign-panel-wrapper</button>
{{yield}}

模板中的Ember嵌套组件 - 如何引用关闭操作的父组件

1 个答案: