Backbone.js错误 - 未捕获TypeError:对象[object Object]没有方法'set'

Question

我的代码:

我是Backbone.js的新手,并尝试使用Backbone.js和PHP构建应用程序.当我试图add在路由器中调用时,我收到错误:

未捕获的TypeError:对象[object Object]没有方法'set'.

请帮我找出我的错误.

谢谢.

    // Models
    window.Users = Backbone.Model.extend({
        urlRoot:"./bb-api/users",
        defaults:{
            "id":null,
            "name":"",
            "email":"",
            "designation":""
        }
    });

    window.UsersCollection = Backbone.Collection.extend({
        model:Users,
        url:"./bb-api/users"
    });


    // Views


    window.AddUserView = Backbone.View.extend({

        template:_.template($('#new-user-tpl').html()),

        initialize:function(){
            this.model.bind("click", this.render, this);
        },

        render:function(){
            $(this.el).html(this.template(this.model.toJSON()));
            return this;
        },

        events:{
            "click .add":"saveUser"
        },

        saveUser:function(){ alert('saveUser');
            this.model.set({
                name:$("#name").val(),
                email:$("#email").val(),
                designation:$("#designation").val()
            });

            if(this.model.isNew()){
                this.model.create(this.model);
            }
            return false;
        }
    });


    // Router
    var AppRouter = Backbone.Router.extend({

        routes:{
            "":"welcome",
            "users":"list",
            "users/:id":"userDetails",
            "add":"addUser"
        },


        addUser:function(){ 
            this.addUserModel = new UsersCollection();
            this.addUserView = new AddUserView({model:this.addUserModel});
            $('#content').html(this.addUserView.render().el);
        }


    });

    var app = new AppRouter();
    Backbone.history.start();

Answer 1

正如评论中所建议的，问题从这里开始：

this.addUserModel = new UsersCollection();
this.addUserView = new AddUserView({model:this.addUserModel});

并在这里结束：

saveUser:function(){ alert('saveUser');
    this.model.set({

通过传递集合来代替模型会造成混乱，因此稍后在函数中saveUser您尝试调用实例上的Backbone.Model方法 ( set) Backbone.Collection。

注意：从 1.0.0 版本开始，Backbone.Collection现在有了一个set方法。在以前的版本中，例如问题作者使用的版本，该方法被称为update.

您可以采取几个步骤来阐明此代码。对于初学者，我将重命名您的模型和集合类，以便清楚地表明模型是单数形式，集合是复数形式：

window.Users=>window.User

window.UsersCollection=>window.Users

接下来，我将创建一个新User模型，而不是Users集合，并将其传递到您的视图：

this.addUserModel = new User();
this.addUserView = new AddUserView({model:this.addUserModel});

最后，我删除这些行：

if(this.model.isNew()){
    this.model.create(this.model);
}

一方面，模型将始终是新的（因为您刚刚在传入模型之前创建了它），但更重要的是，您不需要调用 的方法，Collection因为create当您已经创建了一个模型时，该方法会创建一个新模型。也许你应该添加的是：

this.model.save();

如果您的目的是将模型保存到您的服务器。

由于您已经urlRoot为模型指定了 a ，因此这应该是您创建新模型、将其传递到视图、让视图根据 DOM 元素填充其属性、最后将该模型的属性保存到服务器所需的全部操作。