填充嵌套集合的嵌套JSON数据

Question

填充嵌套集合的嵌套JSON数据

3

解决方案在我的路由中

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

我从服务器得到了一个序列化的JSON数组，我试图将嵌套的对象放入我的嵌套集合中。

我认为这个答案会帮助我，但是我缺少一些东西。如何使用Backbone.js从嵌套的JSON构建Collection/Model

我正在尝试用以下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')返回未定义。

我还尝试通过this.attributes.classes获取类数组，但也未定义。

------------更新以包括重新初始化--------------------

我正在初始化用户和课程的函数在User路由中，称为re_initialize。我使用此函数获取用户及其班级并存储该对象。

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，但它未将类添加到集合中。

我无法包含'collection'，因为由于某种原因我无法在Backbone中访问它。用户模型在返回到Backbone后包括类数组，我正在尝试将其放入ClassList集合中。

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

属性: 对象
创建时间: "2012-01-05T16:05:19Z"
ID: 63
类别: 数组[3]
   0: 对象
   创建时间: "2012-01-18T20:53:34Z"
   ID: 295
   教师ID: 63
   班级代码: 42
   更新时间: "2012-01-18T20:53:34Z"
   班级名称: 数学
   __proto__: 对象
  1: 对象
  2: 对象
  长度: 3
  __proto__: 数组[0]

- pedalpete

你能发布更多的代码吗？例如集合？ - 3logy

@trouble，我已经更新了问题，包括我的“重新初始化”函数和backbone看到的对象，尽管如上所述，我无法通过user.attributes.classes访问类。 - pedalpete

2个回答

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;
  }
});

- 3logy

接近了，但还不够（尽管你为此付出了很大的努力，我仍然会给你胜利，并感谢你，因为你引导我找到了答案。从我看来，这个解决方案的问题在于你建议我为类别进行第二次“fetch”，这是不正确的。我已经对上面的解决方案进行了评论，因为那更接近我最终得出的结果。） - pedalpete

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- satchmorun · Accepted Answer

你可以使用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 集合。这可能是你的问题吗？