骨幹獲取和復位模型時模型添加到收藏

Question

我有一個fiddle here

包含模型

Item = Backbone.Model.extend({....}) 
Apvdtl = Backbone.Model.extend() 

和收集

Apvdtls = Backbone.Collection.extend({ 
    model: Apvdtl 
}) 

與Apvdtl型號 填充集合例如

apvdtls.add([{ itemid: 'c4676cef679a11e28b7a3085a942bd8e', qty: 10 }, 
      { itemid: '1da17339690f11e285d63085a942bd8e', qty: 5 }]) 

，併產生這種觀點

但什麼我嘗試做的是通過與ID獲取該項目，以使這樣的

視圖在此JSON File

ApvdtlView = Backbone.View.extend({ 
    tagName: 'tr' 
    initialize: function(){ 
     this.model.on('change', this.render, this); 
     this.template = _.template('<td><%=itemid%></td><td><%=qty%></td>'); 
    }, 
    render: function(){ 

     item.set({'id': this.model.get('itemid')}); 
     // item = {id: 'c4676cef679a11e28b7a3085a942bd8e'} 

     item.fetch(); // but this doesnt get the data 
     // this should contain this data after i fetch 
     // item = {"id": "c4676cef679a11e28b7a3085a942bd8e", 
     //   "code": "prp125", "descriptor": "Paper", "price": "7.00"} 

     // build new data to render 
     var data = { 
      "itemid": item.get('descriptor'), 
      "qty": this.model.get('qty') 
     } 

     this.$el.html(this.template(data)); 
     //this.$el.html(this.template(this.model.toJSON())); 
     return this; 
    } 
}); 

Answer 1

第一阿賈克斯是異步。所以你永遠不會知道響應什麼時候回來，所以最好把它附加到一個事件上。

ApvdtlView = Backbone.View.extend({ 
    tagName: 'tr', 
    initialize: function() { 

      // This listens to the sync and change event and renders the item 
     this.listenTo(this.model, 'change sync', this.render); 
     this.template = _.template('<td> <%=itemid%> </td>' + 
      '<td><%=qty%></td>'); 
     this.model.fetch(); 

    }, 
    render: function() { 

     this.$el.html(this.template(this.model.toJSON())); 
     return this; 
    } 
}); 

接着url屬性具有用於模型ApvdtlView要被設置爲正被從服務器獲取。

其次是因爲它是一個不同的域，因爲它違反了交叉的起源策略不能從您的域

urlRoot: 'https://raw.github.com/jrsalunga/prism2/master/www/api/item.json' 

打這個網址。您需要使用jsonp得到這個

Check Fiddle

JSONP request Fiddle

現在你可以看到，在網絡選項卡中取出，但因爲回調已被處理拋出一個錯誤的數據serverside