Handlebar - 动态元素属性

时间:2013-08-20 17:40:01

标签: mustache handlebars.js

我想做这样的事情:

{{#each user}}
    <span class="{{user.female ? 'female-span' : 'male-span'}}">{{name}}</span>
{{/each}}

这在angularjs之类的东西上很容易实现,但我不能做这个把手。当我想动态更改元素属性时,车把中要遵循的习语/模式是什么?是否有任何车把插件可以做到这一点?

1 个答案:

答案 0 :(得分:8)

把手只给你{{#if}}帮手(可以在这里使用,它只是冗长的)。由于逻辑较少,它不会评估括号内传递的代码(Underscore模板会这样做)。

这是一件好事,因为它确保您的模板不会有任何副作用。

在这里,您可能希望从模板中删除此逻辑并将类名作为模板参数传递:

template({ genderClass: user.female ? 'female-span' : 'male-span' });

然后,在模板中:

<span class="{{genderClass}}">{{name}}</span>

在你的情况下,你是一个数组,所以你可以添加genderClass作为模型属性。否则你可以使用自定义帮助器方法,但这对于非常简单的事情来说是很多开销。