未捕获的TypeError：对象函数（）{return i.apply（this，arguments）}没有方法'on'

Question

由于某些原因，我继续收到此错误，（请参阅随附的屏幕截图）。我尝试添加_.bindAll(this);，甚至尝试升级我的代码以获得最新版本的backbonejs。仍然没有运气。

有人可以帮我吗？

var app = app || {};

(function ($) {
'use strict';

app.EmployeeView = Backbone.View.extend({
    el: '#container',
    model: app.Employee,
    events: {
        'click #save' : 'saveEntry'
    },
    initialize: function(){
        console.log('Inside Initialization!');
        this.$empName = this.$('#txtEmpName');
        this.$department = this.$('#txtDepartment');
        this.$designation = this.$('#txtDesignation');
        this.listenTo(app.employees, 'add', this.addEmployee);
        app.employees.fetch();
        console.log('End of Initialization!');
        //this.render();
    },
    render: function () {
        console.log('Inside Render!!');
        console.log(this.model);
        this.$el.html(this.template(this.model.toJSON()));
        console.log('Inside End of Render!!');
        return this;
    },
    newAttributes: function(){
        return{
            empName: this.$empName.val(),
            department: this.$department.val(),
            designation: this.$designation.val()
        };
    },

    saveEntry: function(){
        console.log('Inside SaveEntry!');
        //console.log(this.newAttributes());
        console.log('this.model');
        console.log(app.Employee);
        //app.employees.create(this.newAttributes());
        app.Employee.set(this.newAttributes());
        app.employees.add(app.Employee);
        console.log('After SaveEntry!');
    },
    addEmployee: function (todo) {
        var view = new app.EmployeeItemView({ model: app.Employee });
        $('#empInfo').append(view.render().el);
    }
})
})(jQuery);

“collections / employees.js”的代码

var app = app || {};
(function (){
    console.log('Inside collection');
    var Employees = Backbone.Collection.extend({
        model: app.Employee,
        localStorage: new Backbone.LocalStorage('employee-db')
    });
    app.employees = new Employees();
})();

“model / employee.js”的代码

var app = app || {};
(function(){
    'use strict';

    app.Employee = Backbone.Model.extend({
        defaults: {
            empName: '',
            department: '',
            designation: '' 
        }
    });
})();

Answer 1

您在视图中这样说：

model: app.Employee

app.Employee看起来像模型“类”而不是模型实例。您的视图需要其model属性中的模型实例。通常你会说这样的话：

var employee = new app.Employee(...);
var view = new app.EmployeeView({ model: employee });

Answer 2

this.model.toJSON()无效，因为this.model是app.Employee构造函数。实际上我在EmployeeView.render方法中没有任何意义。如果是聚合视图，为什么你有模型呢？否则第二个视图类EmployeeItemView是什么？如果您正在关注ToDo MVC示例，您可以看到AppView中没有模型，这就是为什么我认为您不需要在EmployeeView中建模。您提供的render方法似乎属于EmployeeItemView。

其次，您调用app.Employee.set，这也是对不在对象上的构造函数的调用。我想你的意思是

saveEntry: function(){
    console.log('Inside SaveEntry!');
    app.employees.create(this.newAttributes());
    console.log('After SaveEntry!');
},

如果要将模型传递给app.EmployeeItemView，则应使用回调参数。

addEmployee: function (employee) {
    var view = new app.EmployeeItemView({ model: employee });
    $('#empInfo').append(view.render().el);
}