0

我对backbone.js 很陌生，最近设法完成了我的第一个应用程序。我创建了一个集合，负责通过 API 获取数据，但无法遍历结果并使用它。

这是我的模型文件

define([
    'jquery',
    'underscore',
    'backbone'
], function($, _, Backbone){

    var VehicleLookupModel = Backbone.Model.extend({
        //data will contain one of the items returned from the collection's 'parse' function.
        parse: function(data){
            return data;
        }
    })

    return VehicleLookupModel;

});

收集文件

define([
    'jquery',
    'underscore',
    'backbone',
    'l/models/VehicleLookupModel'
], function($, _, Backbone, VehicleLookupModel){

    var VehicleLookupModelSet = Backbone.Collection.extend({
        model   : VehicleLookupModel,

        url     : function() {
            return '/en/car/api/model-lookup-model.json/'+this.make+'/';
        },

        parse : function(response) {
            return response;
        },

        initialize: function(options) {
            options || (options = {});
            this.make = options.make;
        }
    })

    return VehicleLookupModelSet;

});

最后是视图文件

define([
    'jquery',
    'underscore',
    'backbone',
    'l/collections/VehicleLookupMakeSet',
    'l/collections/VehicleLookupModelSet',
    'l/collections/VehicleLookupTrimSet'
], function($, _, Backbone, VehicleLookupMakeSet, VehicleLookupModelSet, VehicleLookupTrimSet){

    var BrowseVehicleView = Backbone.View.extend({
        el: $('#vehicle-browse-form'),
        initialize: function(){

            // Extend JQuery example
            // This would extend JQuery function for resetting elements on the form
            $.fn.extend({
                resetElement: function(){
                    $(this).attr('disabled', 'disabled');
                    $(this).html('');

                    return $(this);
                }
            });

            // define array of elements to be used in DOM manipulations
            this.elements = {
                "make"      : $('#id_make',     this.el),
                "model"     : $('#id_model',    this.el),
                "trim"      : $('#id_trim',     this.el),
                "year"      : $('#id_year',     this.el)
            }

        },

        events: {
            "change #id_make"   : "onMakeChange",
            "change #id_model"  : "onModelChange",
            "change #id_trim"   : "onTrimChange"
        },
        render: function(){
            // Using Underscore we can compile our template with data

        },
        onMakeChange: function(event) {
            this.elements.model.resetElement();
            this.elements.trim.resetElement();
            this.collection = new VehicleLookupModelSet({make: this.elements.make.val()})
            this.collection.fetch();

            console.log(this.collection);



        },
        onModelChange: function(event) {
            var VehicleLookupTrimInstance = new VehicleLookupTrimSet({make: this.elements.make.val(), model: this.elements.model.val()})
            VehicleLookupTrimInstance.fetch();

        },
        onTrimChange: function(event) {

        },
        renderItem:  function(object, item) {
            console.log(item);
        }

    });
    // Our module now returns our view
    return new BrowseVehicleView;
});

以上是 console.log(this.collection) 正在返回一个具有许多不确定如何使用的属性的对象。但是，我注意到有一个方法“模型”，在模型内部有很多对象，每个对象代表 json 的值。

有什么想法可以遍历对象吗？

4

1 回答 1

8 
this.collection.fetch({
  success: function(collection, response) {
    _.each(collection.models, function(model) {
      console.log(model.toJSON());
    })
  }
});
于 2012-10-21T00:57:08.923 回答