Backbone.js添加事件問題

Question

我有以下backbone.js代碼，並在該事件中遇到問題，然後我從集合中觸發「添加」事件。在success:提取中添加this.field.add(list_fields);導致錯誤。我如何確保模型被提取然後添加事件運行後

$(function() { 
     $(".chzn-select").chosen(); 
     /*********************************Models*************************************************/ 
     var Table = Backbone.Model.extend({ 

      urlRoot : '/campusfeed/index.php/welcome/generate' 
     }); 
     var Field = Backbone.Model.extend({ 
      urlRoot: '/campusfeed/index.php/welcome/generate' 
     }); 
     /**************************Collections*************************************************/  
     Tables = Backbone.Collection.extend({ 
      //This is our Friends collection and holds our Friend models 
      initialize : function(models, options) { 
       this.bind("add", options.view.addFriendLi); 
      //Listen for new additions to the collection and call a view function if so 
      } 
     }); 

     var Fields = Backbone.Collection.extend({ 
      model:Field, 
      url:'http://localhost/campusfeed/index.php/welcome/generateFields', 
      initialize : function(models, options) { 
       this.bind("add", options.view.getFields); 
      } 
     }); 
     /************************************Views**************************************************/ 
     var m="shit"; 
     var app = Backbone.View.extend({ 
      el:'body', 
      initialize:function(model,options){ 
       //Create collections in here 

       this.table = new Tables(null,{ 
        view : this 
       }); 
       this.field = new Fields(null,{ 
        view : this 
       }); 
      }, 
      events : { 
       "click #choose" : "generate" 

      }, 
      generate:function(){ 
       var table = (this.$("#table option:selected").text()); 
       var dbname = (this.$("#database").text()); 
       var list_fields = new Field(); 
       list_fields.urlRoot = list_fields.urlRoot+"/"+dbname+"/"+table; 
       list_fields.fetch({ 
        success:function(){ 
         console.log(JSON.stringify(list_fields)); 


        } 
       }); 

       this.field.add(list_fields); 

      }, 

      getFields:function(model){ 

       console.log(JSON.stringify(model)); 


      } 



     }); 
     var apprun = new app; 
    /* var data = new Fields(); 
     data.url=data.url+"/some/data"; 
     alert(data.url); 
     data.fetch(); 
     var staff = new Table(); 
     staff.fetch(); 
     var field = new Field();*/ 
    }); 

Answer 1

問題是「this」的上下文。成功回調函數將「this」設置爲list_fields。你可以用「self」或「that」變量解決這個問題：

 generate:function(){ 
      var table = (this.$("#table option:selected").text()); 
      var dbname = (this.$("#database").text()); 
      var list_fields = new Field(); 
      list_fields.urlRoot = list_fields.urlRoot+"/"+dbname+"/"+table; 
      var that = this; 
      list_fields.fetch({ 
       success:function(){ 
        console.log(JSON.stringify(list_fields)); 

        that.field.add(list_fields); 
       } 
      }); 
     }, 

作爲一個附註 - 你的集合不應該有一個視圖的引用。相反，您的視圖應該引用收集並綁定到收集事件

var Fields = Backbone.Collection.extend({ 
     model:Field, 
     url:'http://localhost/campusfeed/index.php/welcome/generateFields', 
    }); 

    var app = Backbone.View.extend({ 
     initialize:function(model,options){ 
      //Create collections in here 

      this.field = new Fields(); 
      this.field.bind("add", this.getFields, this); 
     }, 
     getFields: function(){ ... } 
    });