Question

我正在探索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-vvron-right'路径。我缺少什么想法？

修改

类型的选择正在模型级别上进行：

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

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

    toggle: function() {
        if (this.is_selected()) {
            this.set('selected', false);
        }
        else
        {
            this.set('selected', true);
        }
    }
});

MA.Collections.Categories = Backbone.Collection.extend({
    model: MA.Models.Genre  
});

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

Answer 1

没有看到你的观点中发生的事情，很难说。但是你可能有一个看起来像的渲染函数：

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

带HandelbarJS的BackboneJS：如何访问模型函数？

1 个答案: