#6 块参数

英文原版：https://guides.emberjs.com/v2.14.0/components/block-params/

组件可以被传入参数，同时组件也可以通过块参数来返回输出。

通过{{yield}}从组件返回值

app/templates/index.hbs{{blog-post post=model}}

app/templates/components/blog-post.hbs{{yield post.title post.body post.author}}

在这里，post模型被当做参数传入了blog-post组件。同时，组件通过yield来返回传入的值。在这种情况下，返回的值是从被传入的参数post模型中提取的，并且组件可以从它能访问到的任何地方来提取值，比如组件内的属性。

使用块参数的值

块表达式可以将块参数通过名称绑定到块内使用的yield值上。这将使得在使用组件时可以定制模板，而且组件对任何事件的处理行为都将被保留。

app/templates/index.hbs{{#blog-post post=model as |title body author|}}  <h2>{{title}}</h2>  <p class="author">by {{author}}</p>  <p class="post-body">{{body}}</p>{{/blog-post}}

这些变量名称将会按照被传入组件模板的顺序被绑定。

同时支持块方式和普通方式的组件用法

通过在模板中使用hasBlock 属性，就可以支持块和飞块方式的组件模板：

app/templates/components/blog-post.hbs{{#if hasBlock}}  {{yield post.title post.body post.author}}  {{else}}  <h1>{{post.title}}</h1>  <p class="author">Authored by {{post.author}}</p>  <p>{{post.body}}</p>{{/if}}

这个效果就是当组件是以默认非块的方式使用的，那么组件模板就else中的样子，如果组件是以块方式来使用的，那么就是if中的样子。

本节完