Question

我创建了2个单独的视图，1个用于渲染模板，另一个用于绑定事件，然后我尝试将它们合并为一个，在这种情况下它会导致Uncaught TypeError: Object [object Object] has no method 'template'。它呈现模板和事件也正常，但我收到了错误。

edit.js，这是组合视图，我认为它与他们的el有关，其中错误来自

window.EditView = Backbone.View.extend ({
    events: {
        "click #btn-save" : "submit"
    },
    initialize: function() {
        this.render();
    },
    render: function() {
        $(this.el).html(this.template());
        return this;
    },
    submit: function () {
        console.log('editing');
        $.ajax({ ... });
        return false;
    }
});
var editView = new EditView();

signin.js，这是我无法合并的视图，因为ajax调用使用的el和SigninView的{{1}}导致渲染模板有问题

$(this.el)

我使用utils.js来调用我的模板

window.toSigninView = Backbone.View.extend ({
    el: '#signin-container',
    events: {
        "click #btn-signin" : "submit"
    },
    initialize: function() {
        console.log('Signin View');
    },
    submit: function() {
        $.ajax({ ... });
        return false;
    }
});


var toSignin = new toSigninView();

window.SigninView = Backbone.View.extend({
    initialize: function() {
        this.render();
    },
    render: function() {
        $(this.el).html(this.template());
        return this;
    }
});

在我的Router.js中，这是我调用模板渲染的方式

window.utils = {
    loadTpl: function(views, callback) {
        var deferreds = [];
        $.each(views, function(index, view) {
            if (window[view]) {
                deferreds.push($.get('templates/' + view + '.html', function(data) {
                    window[view].prototype.template = _.template(data);
                }));
            } else {
                alert(view + " not found");
            }
        });
        $.when.apply(null, deferreds).done(callback);
    }
};

Answer 1

我认为我发现了你的问题。

首先合并您的观点并删除第var toSignin = new toSigninView();行

第二次修改你的utils.js代码：

window[view].prototype.template = _.template(data);
new window[view]();

Backbonejs使用el

1 个答案: