Backbone.js lỗi - lỗi chưa gặp: Object [đối tượng Object] không có phương pháp 'đặt'

Question

Mã của tôi:

Tôi mới vào Backbone.js và cố gắng xây dựng một ứng dụng với Backbone.js và PHP. Khi tôi đang cố gọi add trong bộ định tuyến, tôi gặp lỗi:

Uncaught TypeError: Object [object Object] has no method 'set'.

Hãy giúp tôi tìm lỗi của mình.

Cảm ơn.

// 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

Như đã đề cập trong các ý kiến, bài toán bắt đầu ở đây ở đây:

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

và kết thúc ở đây:

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

Bằng cách vượt qua một bộ sưu tập ở vị trí của một mô hình mà bạn tạo ra sự nhầm lẫn, và kết quả là sau này trong hàm saveUser bạn cố gắng gọi một phương thức Backbone.Model (set) trên một cá thể Backbone.Collection.

---

Lưu ý: Kể từ phiên bản 1.0.0 Backbone.Collection hiện có phương thức set. Trong các phiên bản trước, chẳng hạn như phiên bản được tác giả của câu hỏi sử dụng, phương pháp đó thay vào đó được gọi là update.

---

Có một số bước bạn có thể thực hiện để làm rõ mã này. Đối với người mới bắt đầu, tôi sẽ đổi tên mô hình và bộ sưu tập các lớp học của bạn để nó là rõ ràng rằng mô hình này là số ít hình thức và bộ sưu tập là hình thức số nhiều:

window.Users =>window.User

window.UsersCollection =>window.Users

Tiếp theo, tôi sẽ tạo ra một mô hình mới User, thay vì một bộ sưu tập Users, và thông qua đó để xem của bạn:

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

Cuối cùng, tôi muốn loại bỏ những dòng này:

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

Đối với một điều, mô hình sẽ luôn luôn mới (như bạn vừa tạo ra nó trước khi đi qua nó trong), nhưng quan trọng hơn là bạn không cần gọi phương thức create của Collection vì phương pháp đó tạo ra một mô hình mới, khi bạn đã tạo một mô hình mới. Có lẽ những gì bạn nên thêm thay vào đó là:

this.model.save(); 

nếu ý định của bạn là lưu mô hình vào máy chủ của bạn.

Vì bạn đã chỉ định urlRoot cho mô hình, nên là tất cả những gì bạn cần để tạo mô hình mới, chuyển nó cho chế độ xem của bạn, để chế độ xem của bạn điền vào các thuộc tính của nó dựa trên các phần tử DOM và cuối cùng lưu thuộc tính của mô hình đó đến máy chủ của bạn.

Answer 2

Tôi nghĩ rằng bạn đang phải đối mặt với vấn đề với phạm vi đối tượng. Khi sự kiện đã kích hoạt nó gửi tới đối tượng sự kiện đến hàm đó. Chỉ cần cố gắng này, nó có thể làm việc Khai báo biến toàn cầu với giao diện hiện tại bên trong khởi

initialize : function(){ self = this; } 

sau đó thay đổi này để tự,

 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; 
    }