#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')
});

我想"cssClass"在"#linkTo"帮助器中使用该属性.现在,它是如何完成的(语法上)？

我试过这个,但这显然不起作用,因为使用{{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>