使用嵌套的json填充嵌套集合

时间:2012-01-16 18:42:10

标签: backbone.js nested

解 在我的路线

Myapp.Routes = Backbone.Router.extend({
   init: function(){
        user = new User();
        user.fetch({user,
                     success: function(response){
                             user.classlist = new classes(response.attributes.classes);
           });

   }

});

我从我的服务器返回了一个序列化的json数组,我试图将嵌套对象放入我的嵌套集合中。

这个答案,我认为会让我在那里,但我错过了一些东西。 How to build a Collection/Model from nested JSON with Backbone.js

我试图用我的嵌套模型填充的json是

{first_name: "Pete",age: 27, classes: [{class_name: "math", class_code: 42},{class_name: "french", class_code: 18}]}

我创建了我的用户模型

MyApp.Models.Users = = Backbone.Model.extend({

    initialize: function(){
        this.classlist = new MyApp.Collections.ClassList();

        this.classlist.parent = this;

    }

});

我曾尝试在其他页面上关注该示例,并使用

      this.classlist = new MyApp.Collections.ClassList(this.get('classes'));

        this.classlist.parent = this;

this.get('classes')返回undefined。

我也试过通过this.attributes.classes获取classes数组,但这也是未定义的。

------------更新以包含重新初始化-------------------- 我正在初始化用户和类的函数位于用户路由中,称为重新初始化。我使用此函数来获取用户及其类并存储该对象。

re_initialize: function(id){
            user = new MyApp.Models.User();
            MyApp.editingClasses.url = 'classes/'+id;
            MyApp.editingClasses.fetch({
                        success: function(response){
                        MyApp.editingClasses.parse(response);
                        }
            });

        new MyApp.Views.ClassesInput();
    },

如您所见,我在成功函数中显式调用parse,但它没有将类添加到集合中。

我不能包含'集合',因为由于某种原因我不能在骨干中访问它。 返回骨干后的用户模型包括classes数组,我试图将其放入ClassList集合中。

从javascript终端复制的用户模型对象如下所示。

attributes: Object
created_at: "2012-01-05T16:05:19Z"
id: 63
classes: Array[3]
   0: Object
   created_at: "2012-01-18T20:53:34Z"
   id: 295
   teacher_id: 63
   class_code: 42
   updated_at: "2012-01-18T20:53:34Z"
   class_name: math
   __proto__: Object
  1: Object
  2: Object
  length: 3
  __proto__: Array[0]

2 个答案:

答案 0 :(得分:9)

您可以使用parse功能预处理服务器响应:

MyApp.Models.Users = Backbone.Model.extend({
  parse: function(response) {
    var classesJSON = response.classes;
    var classesCollection = MyApp.Collections.ClassList(classesJSON);
    response.classes = classesCollection;
    return response;
  }
});

var user = new MyApp.Models.Users();
user.fetch();

// You should now be able to get the classlist with:
user.get('classes');

尽管如此,在另一个问题中提出的方法也应该有效。可能是在调用initialize函数时,模型尚未填充数据?

例如,如果你正在做:

var user = new MyApp.Models.Users();

它还没有任何属性可以提供给classlist集合。这可能是你的问题吗?

答案 1 :(得分:4)

好!你可以用这种方式获取课程:

型号:

window.person = Backbone.Model.extend({
 defaults: { }
});

收藏:

window.ClassesCollection = Backbone.Collection.extend({
 model: person,  
 url: "http://your/url/data.json",
 parse: function(response){
   return response.classes;
 }
});

路由器:

window.AppRouter = Backbone.Router.extend({
 routes: {
  ""  : "init"
 },

 init: function(){      
   this.classesColl = new ClassesCollection();
   this.classesColl.fetch();
   this.classesView = new ClassesView({collection: this.classesColl});     
 }
 });

查看:(用于呈现每个班级)

window.ClassesView = Backbone.View.extend({
  el: $('...'),
  template: _.template($("...").html()),

  initialize: function() {
    this.collection.bind("reset", this.render, this);
  },
  render: function(collection) {

    _.each( collection.models, function(obj){ 
      ...
      //obj.get('class_name') or obj.get('class_code')
      ... 
    }, this );
       ...
    return this;
  }
});