在ember Handlebars模板中添加控制器定义的CSS类的最简单方法

时间:2013-07-29 13:27:45

标签: ember.js

我有以下模板:

...
<i class="icon-fixed-width {{myIcon}} icon-4x"></i>
...

我的控制器将myIcon定义为一个简单的字符串:

App.NodesController = Ember.ArrayController.extend({
    ...
    myIcon          : 'icon-cloud',
    ...
});

(此设置在控制器中。背景是我想为不同的控制器重用模板,因此只需通过'配置'每个控制器,我得到一个不同的图标)

问题是{{myIcon}}产生了令人惊讶的结果(对我来说,至少!):

<i class="icon-fixed-width <script id='metamorph-8-start' type='text/x-placeholder'></script>icon-cloud<script id='metamorph-8-end' type='text/x-placeholder'></script> icon-4x"></i>

如何达到预期效果:

<i class="icon-fixed-width icon-cloud icon-4x"></i>

访问控制器中的myIcon

1 个答案:

答案 0 :(得分:3)

使用{{bindAttr class='myIcon'}} ... Reference to bindAttribute Classes