これがベストプラクティスなのか、それとも要素のクラスを動的に変更する簡単な方法が欠けているのか疑問に思っています:
define(function () {
'use strict';
var NextButtonView = Backbone.View.extend({
className: 'disabled halfGradient',
template: _.template($('#nextButtonTemplate').html()),
attributes: function() {
return {
id: 'NextButton',
title: chrome.i18n.getMessage("skipNextVideo")
};
},
render: function () {
this.$el.html(this.template(this.model.toJSON()));
this.$el.toggleClass('disabled', !this.model.get('enabled'));
return this;
},
initialize: function () {
this.listenTo(this.model, 'change:enabled', this.render);
}
});
return NextButtonView;
});
私のテンプレートは次のとおりです。
<script type="text/template" id="nextButtonTemplate">
<svg width="16px" height="16px">
<rect class="path" x="14" y="3" width="2" height="10" fill="gray" />
<path class="path" d="M0,3 L7,8 L0,13z" fill="gray" />
<path class="path" d="M7,3 L14,8, L7,13z" fill="gray" />
</svg>
</script>
モデルの状態に基づいてクラスを設定するより「暗黙的な」方法はありますか?