BACKBONE.JSエラー - キャッチされない例外TypeError：オブジェクト[オブジェクトのオブジェクト]は何の方法「設定」を持っていない

Question

マイコード：

私はBACKBONE.JSに新しいですし、BACKBONE.JSやPHPでアプリを構築しようとしています。私はルータでaddを呼び出すようにしようとしていたとき、私はエラーを取得しています：

Uncaught TypeError: Object [object Object] has no method '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.CollectionインスタンスでBackbone.Modelメソッド（set）を呼び出そうとします。

---

注：バージョン1.0.0 Backbone.Collectionのとおり、今set方法があります。質問の著者が使用したような以前のバージョンでは、そのメソッドは代わりにupdateと呼ばれていました。

---

このコードを明確にするためにいくつかの手順があります。 =>window.Users

window.Users =>window.User

window.UsersCollection：それはモデルが単数形であることは明らかだとコレクションが複数形になるように、まず第一に、私はあなたのモデルとコレクションクラスの名前を変更します

次は、私が代わりにUsers集まり、新しいUserモデルを作成し、あなたのビューにそれを渡します。

（あなたはそれを中に渡す前に、それを作成したとして）モデルは、常に新しいなり、一つには

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

が、もっと重要なのは、あなたにはありません：

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

最後に、私はこれらの行を削除したいですCollectionのcreateメソッドを呼び出す必要があります。これは、そのメソッドが既に作成されている場合、そのメソッドが新しいモデルを作成するためです。代わりに次のように追加する必要があります。

this.model.save(); 

モデルをサーバーに保存する場合は、

モデルに既にurlRootを指定しているので、新しいモデルを作成してビューに渡し、DOM要素に基づいてビューの属性を記入し、最後にそのモデルの属性を保存する必要がありますあなたのサーバーに。

Answer 2

私はあなたがオブジェクトのスコープに問題に直面していると思います。イベントが発生すると、イベントオブジェクトにその関数を送信します。ただ、これを試して、それは が初期化

initialize : function(){ self = this; } 

その後、自己にこれを変更し、

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

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