#linkTo helper中的動態CSS類字符串（使用ember.js版本pre4）

Question

我有一個像這樣的把手模板：

<script type="text/x-handlebars" data-template-name="sections">
  {{#each section in controller}}
    {{#linkTo "section" section}} {{ section.label }} {{/linkTo}}
  {{/each}}
</script>

一切正常。 我的模型對象如下所示：

App.Section = DS.Model.extend({
 sectionDetail: DS.attr('number'),
 label: DS.attr('string'),
 cssClass: DS.attr('string')
});

我想在"#linkTo"幫助器中使用"cssClass"屬性。 現在，它是如何完成的（語法上）？

我試過這個，但是這顯然不起作用，因為使用{{section.cssClass}}不會呈現section.cssClass的值，而是呈現字符串"{{section.cssClass}}" 。

<script type="text/x-handlebars" data-template-name="sections">
  {{#each section in controller}}
    {{#linkTo "section" section class="{{section.cssClass}}"}} {{ section.label }} {{/linkTo}}
  {{/each}}
</script>

我找不到一個有效的解決方案，有人能指出我在這里正確的方向，或者很難實現我想做的事情嗎？ 我應該以不同方式構建鏈接嗎？

Answer 1

對於在這里磕磕絆絆的其他人來說，解決方案是使用classNamesBindings 。

<script type="text/x-handlebars" data-template-name="sections">
  {{#each section in controller}}
    {{#linkTo "section" section classNameBindings="section.cssClass"}} 
      {{section.label }}
    {{/linkTo}}
  {{/each}}
</script>

Answer 2

是的，我有這個：

<input type="checkbox" {{bind-attr class=":toggle isLiked:toggleHighlight"}}>

並且需要這樣做，使它成為輸入助手，但無法想出如何關閉元素（新手）：

{{input type="checkbox" checked=isLiked}}

所以classNameBindings救援：

{{input type="checkbox" checked=isLiked classNameBindings=":toggle isLiked:toggleHighlight"}}