0

我正在尝试使用require.js、AMD 和handlebars 为模板构建一个Backbone 应用程序。这是我的索引视图的代码。

define([
  'jquery',
  'underscore',
  'backbone',
  'handlebars',
  'collection/questions',
  'helpers'
], function($, _, Backbone, Handlebars, QuestionsCollection, Helpers){
// Main Index View
var IndexView = Backbone.View.extend({
    el: "#content",
    template: Helpers.template('index'),

    initialize: function(){
        this.questions = new QuestionsCollection();
        this.questions.on('sync', this.render, this);
        this.questions.fetch();
    },

    render: function(){
        this.$el.html(this.template(this));
        this.questions.each(this.addQuestion, this);
        return this;
    },

    addQuestion: function(question){
        var view = new IndexView.Question({ model: question });
        view.render();
    },

    count: function(){
        console.log(this);
        return this.questions.length;
    }
});

// Individual Question View
IndexView.Question = Backbone.View.extend({
    render: function(){
        // console.log(this.model);
    }
});

return IndexView;
});

在这里，一切都按预期工作。但现在我想要一个辅助函数 count 来返回集合中模型的数量。这样我就可以用{{count}}我handle bar template的来打印类似的东西。'There are 8 questions'. 但我的范围有问题。

内部count函数 this 指的是window而不是指collection. 我将如何count在question collection. 我计划在我的应用程序中使用许多这些辅助功能。所以需要一些可靠的方法来做到这一点。

谢谢。

4

1 回答 1

4

您可以使用 Underscore.js 中的“ bindAll ”函数，如下所示：

initialize: function () {
    _.bindAll(this, 'count');
    // your initialize code
}

基本上，它用类似于以下的代码替换了您的“计数”方法：

var thisReference = this;
var originalCount = this.count;

this.count = function () {
    originalCount.apply(thisReference, Array.prototype.slice.call(arguments));
};

即，它只是保存原始的“this”引用，并在调用“count”方法时传递它。

今天的浏览器已经内置了对这个习惯用法的支持（参见 参考资料 Function.bind）。

不过，在这种情况下，最好将 传递count为模板变量：

render: function () {
    this.template({
        count: this.count()
    });
}
于 2013-01-20T03:11:09.123 回答