1

我正在探索使用 HandelbarsJS 和 Backbone 的设置。

这是我的模板的一部分：

<a href="#genre/{{ name }}" class="genre-item" data-genre="{{ name }}">
  <i class="icon-chevron-{{#if is_selected }}down{{else}}right{{/if}}"></i>
  {{ display_name }} ({{ total }})
</a>

含义：我想根据是否选择模型来呈现不同的图标。但是，我从来没有得到“icon-chevron-down”，而是“icon-chevron-right”路径。有什么我想念的想法吗？

编辑

流派的选择是在模型级别上进行的，如下所示：

MA.Models.Genre = Backbone.Model.extend({
    默认值：{
        选择：假
    },

    is_selected：函数（）{
        return (this.get('selected') == true);
    },

    切换：函数（）{
        if (this.is_selected()) {
            this.set('selected', false);
        }
        别的
        {
            this.set('selected', true);
        }
    }
});

MA.Collections.Categories = Backbone.Collection.extend({
    型号：MA.Models.Genre  
});

这可能会被简化，但我没有从远程服务中选择流派，但它只是用作临时状态更改。

4

1 回答 1

2

如果没有看到您认为正在发生的事情，就很难说清楚。但是你可能有一个看起来像这样的渲染函数：

HandlebarsTemplate['templatename'](this.model.toJSON());

toJSON默认情况下仅包含模型属性。车把也不会像那样即时评估功能。

最简单的解决方案是将模板修复为如下所示：

<a href="#genre/{{ name }}" class="genre-item" data-genre="{{ name }}">
    <i class="icon-chevron-{{#if selected }}down{{else}}right{{/if}}"></i>
    {{ display_name }} ({{ total }})
</a>

我已经改为is_selected使用selected属性而不是函数。

另一种选择是修改toJSON模型的函数以包含评估函数：

MA.Models.Genre = Backbone.Model.extend({
    defaults: {
        selected: false
    },

    is_selected: function() {
        return (this.get('selected') == true);
    },

    toJSON: function(options) {
        var attrs = _.clone(this.attributes);
        attrs.is_selected = this.is_selected();
        return attrs;
    }
});
于 2013-05-05T00:32:00.610 回答