Question

使用块参数，我认为以下方法可以将组件暴露给嵌套控件，而不需要_yield hack。

{{#my-component as |myparam|}}
    {{log myparam}}
{{/my-component}}

这似乎不起作用，因为此日志返回undefined。

我正在使用ember-cli 0.1.15 ember 1.10.0和ember-cli-htmlbars 0.7.4。我需要做些什么来启用块参数，还是这不是正确的符号？

更新

有关示例用法，请考虑使用带有幻灯片和控制按钮的灵活轮播。

{{#carousel-component as |carousel|}}
    {{#slide-component}}
      <button {{action "nextSlide" target=carousel}}>Next</button>
    {{/slide}}
{{/carousel-component}}

具体而言，这是尝试使用Ember 1.10中提供的新block params语法严格解决此用例。

Answer 1

Per http://emberjs.com/blog/2015/02/07/ember-1-10-0-released.html，看起来新语法需要通过组件的yield帮助程序传递的块参数。我已经制作了一个JSBin来说明：

http://emberjs.jsbin.com/jacosewefu/4/edit

Answer 2

将整个组件作为块参数传递是隔离原则，因此除非有特殊原因，否则请传递特定参数。

将此作为组件的模板使用：

{{yield context}}

然后，当你写：

{{#carousel-component as |carousel|}}
    {{#slide-component}}
      <button {{action "nextSlide" target=carousel}}>Next</button>
    {{/slide}}
{{/carousel-component}}

更多关于块参数：
http://emberjs.com/blog/2015/02/07/ember-1-10-0-released.html#toc_block-params

如何通过Ember 1.10 + HTMLBars中的块参数公开组件

2 个答案: