ember.js - 如何从 block 形式组件 Ember.js 中插入的模板触发组件的操作？

Question

我想从插入 block 形式组件的模板中触发组件的操作，如下所示:

{{#block-component}}
   <p> HTML inserted in block form </p>
   <p> How trigger a action from block-component (not your parent) from this scope? </p>
   <p {{action 'actionFromBlockComponent'}}> Fire component's action!!! </p>
{{/block-component}}

Ember 1.10.0 中启用的 block 参数可以帮助我解决这个问题吗？或者说这个需求是不可能实现的？

Answer 1

使用 1.10.0 中的新 block 参数，可以通过执行以下操作来实现:

{{#block-component as |component|}}
    <p> HTML inserted in block form </p>
    <p> How trigger a action from block-component (not your parent) from this scope? </p>
    <p {{action 'actionFromBlockComponent' target=component}}> Fire component's action!!! </p>
{{/block-component}}

注意设置为 block 参数的操作目标。

block 组件的模板应包含以下内容:

{{ yield this }}

它只是传递组件本身作为使用该组件的任何模板的 block 参数。