使用骨幹提取檢索列表

Question

我是Backbone.js的新手，覺得我必須缺少一些非常基本的東西。我想了解如何設置可以檢索數據的模型/集合。爲此，我正在實例化一個模型/集合，然後立即調用fetch（）來填充它（我知道引導第一個調用是最佳實踐，但我現在只想理解fetch（））。我創建的示例模型確實啓動了對RESTful服務的網絡調用，但在fetch調用之後它仍處於Pending狀態，並且在fetch調用中我的成功回調從未到達過，因此模型從未獲取任何數據。

這裏是我的js代碼：

var MyProducts = Backbone.Collection.extend({ 
    url: contextPath + "/carousel.json" 
}); 

var MyProductsCollection1 = Backbone.Collection.extend({ 
    urlRoot: contextPath + "/carousel.json", 
    url: contextPath + "/carousel.json" 
}); 

var MyProductsCollection2 = Backbone.Collection.extend({ 
    url: contextPath + "/carousel.json" 
}); 

var MyView = Backbone.View.extend({ 

    render: function() { 
     console.log('this.collection'); 
     console.log(this.collection); 

     return this; 
    } 
}) 

var myProducts; 
var myProductsCollection1; 
var myProductsCollection2; 

$(function() { 
    myProducts = new MyProducts(); 
    myProducts.fetch({ 
     success: function (model) { 
      var result = model.get("records"); 
     } 
    }); 

    myProductsCollection1 = new MyProductsCollection1(); 
    myProductsCollection1.fetch({ 
     success: function (model) { 
      var result = model.get("records"); 
     } 
    }); 

    myProductsCollection2 = new MyProductsCollection2(); 
    myProductsCollection2.fetch({ 
     success: function (model) { 
      var result = model.get("records"); 
     } 
    }); 

    var myView1 = new MyView({ collection: myProductsCollection1 }); 
    var myView2 = new MyView({ collection: myProductsCollection2 }); 
    console.log('view1'); 
    myView1.render(); 
    console.log('view2'); 
    myView2.render(); 
}); 

這裏是控制檯輸出，這對我來說似乎表明，沒有記錄是從取（）調用檢索：

view1 
this.collection 
child {length: 0, models: Array[0], _byId: Object} 
view2 
this.collection 
hild {length: 0, models: Array[0], _byId: Object} 

在網絡標籤，有3個請求carousel.json，但都顯示Status = pending，表示他們沒有完成。

REST api的域名與網站的域名相同（我打電話給Spring控制器來檢索視圖和這個JSON），所以不應該有任何跨域問題。

以下是一些郵遞員致電https://mydomain/mycontextdir/carousel.json的結果。 （實際結果集較長，但格式相同）：

{ 
    "records": [ 
     { 
      "properties": [ 
       { 
        "name": "pDefaultCatgroupID", 
        "value": "1000357" 
       }, 
       { 
        "name": "highPriceFormatted", 
        "value": "$7.95" 
       }, 
       { 
        "name": "REG_HIGH_PRICE", 
        "value": "7.950000" 
       } 
      ] 
     }, 
     { 
      "properties": [ 
       { 
        "name": "REG_LOW_PRICE", 
        "value": "13.950000" 
       }, 
       { 
        "name": "pItemID", 
        "value": "1254778" 
       } 
      ] 
     } 
    ], 
    "navigableFacets": null, 
    "refinmentFacets": null, 
    "breadcrumbs": [], 
    "content": null, 
    "totalRecords": 5868, 
    "navigationPath": [], 
    "searchReport": { 
     "fault": { 
      "hasFault": false, 
      "faultCommandName": null, 
      "faultCode": null, 
      "faultStatus": null, 
      "faultMessageKey": null, 
      "faultMessage": null, 
      "errors": null 
     }, 
     "commerceId": null, 
     "loggedInCommerce": false, 
     "terms": null, 
     "autoSuggestion": null, 
     "profanity": false 
    } 
} 

我在做什麼錯誤，防止數據被檢索？

非常感謝您的協助！

Answer 1

它看起來像是從Model取回Collection（注意傳遞給成功回調參數的區別）的混淆。在集合上調用fetch時，集合需要返回一組模型數據，如果數據不符合該格式，則可以覆蓋它的解析函數來處理數據。因爲你的json實際上是一個對象而不是數組，你將需要自己解析它。

所以你的情況，你想做的事是

var MyProducts = Backbone.Collection.extend({ 
    url: contextPath + "/carousel.json", 
    parse: function (data) { 
     return data.records; 
    } 
}); 


var myProducts = new MyProducts(); 
myProducts .fetch({ 
    success: function (collection, response, options) { 
    alert(collection.length); 
    }); 

下面是從獲取一個jsbin