Question

我不确定如何使用以下数据创建Backbone Collection，并想知道应该如何处理它。

JSON中的items属性对我来说是有意义的，因为它已经是一个数组。但是，是否有一种很好的方法可以将其他信息提供给集合，或者在需要在视图中引用时保持持久性？我该如何处理集合的以下数据格式？

以下是一些示例数据和代码：

{
"page": 1,
"total": 1000,
"items": [
    {
        "title": "title of item 1",
        "color": "green",
        "type": [
            {
                "isStandard": "Yes",
                "size": "Large"
            },
            {
                "isStandard": "No",
                "size": "Medium"
            }
        ],
        "price": "9.99"
    },
    {
        "title": "title of item 2",
        "color": "blue",
        "type": [
            {
                "isStandard": "No",
                "size": "XXL"
            },
            {
                "isStandard": "No",
                "size": "XXS"
            }
        ],
        "price": "19.99"
    },
    {
        "title": "title of item 3",
        "color": "red",
        "type": [
            {
                "isStandard": "No",
                "size": "Small"
            },
            {
                "isStandard": "Yes",
                "size": "Large"
            }
        ],
        "price": "229.99"
    }
],
"date": "Wed Oct 08 2014 21:04:05 GMT-0500 (CDT)"
}

＆＃13;

var SomeModel = Backbone.Model.extend({});

var SomeCollection = Backbone.Collection.extend({
  model: SomeModel,
  
  url: 'https://api.mongolab.com/api/1/databases/backbonecollectiontest/collections/backbonecollection?apiKey=qcVNgNb-s1X4WJkLeRDfykxqtMG-ezkC',
  
  parse: function(response) {
      // Returning only the items data.  But this will be missing data in the response
      // that is not included in the items property
      return response[0].items;
  }
});

var SomeView = Backbone.View.extend({
    el: '.js-container',
  
    initialize: function() {
        this.collection = new SomeCollection();
      
        this.collection.fetch();
      
        this.listenTo(this.collection, 'sync', this.render); 
    },
  
    template: _.template( $('#some-template').html() ),
  
    render: function() {
      
      this.$el.html( this.template( {collection: this.collection.toJSON()} ) );
      
   }
});

var someView = new SomeView();

＆＃13;

<div class="js-container">
</div>

<script type="text/template" id="some-template">
    <h3>How should I get the 'page', 'total', and 'date' properties in the data here?</h3>
    <% _.each(collection, function(element, index) { %>
      <p>
        <%- element.title %>, 
        <%- element.color %>, 
        <% _.each(element.type, function(ele, i) { %>
          <%- ele.isStandard %>,
          <%- ele.size %>,
        <% }); %>
        <%- element.price %>
      </p>
    <% }); %>

</script>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://underscorejs.org/underscore-min.js"></script>
<script src="http://backbonejs.org/backbone-min.js"></script>

＆＃13;

Answer 1

看起来你需要嵌套模型：

这是一个抓住这个想法的原型，更多信息结帐this post

1）为项目创建模型和集合

var Item = Backbone.Model.extend({
    defaults: {
        "title": "no-title",
        "color": "no",
        "type": [],
        "price": "0"
    }
});

var ItemsCollection = Backbone.Collection.extend({
    model: Item
});

2）创建父模型，在您的情况下看起来像页面：

var PageModel = Backbone.Model.extend({
    defaults: {
        page: 0,
        date: 'now',
        total: 0,
        items: []
    },
    initialize: function() {
        var items = this.get('items');
        this.set('items', new ItemsCollection(items));
    }  
});

如果你有一个JSON resp数组，你也可以创建PageCollection。

如何使用不平坦的数据创建Backbone集合

1 个答案: