如何在backbone.js中创建具有多种模型类型的集合?

Joe*_*oel 7 inheritance javascript-framework backbone.js

我试图让这个工作,但我很努力.当我检查success回调时,我的收藏结果为空fetch.它没有给我任何明显的错误parse.这是我的代码:

我的收藏:

VOR.Collections.GridItems = Backbone.Collection.extend({
        model : VOR.Models.GridItem,
        url: "assets/data/grid.json",
        parse: function(response){
            var self = this;

            _.each(response, function(griditem){
                switch(griditem.type){
                    case "news":
                        self.add(new VOR.Models.NewsGridItem(griditem));
                        break;
                    default:
                        self.add(new VOR.Models.StandardGridItem(griditem));
                        break;
                }
            });
        }
});
Run Code Online (Sandbox Code Playgroud)

这就是我创建集合的方式:

griditems = new VOR.Collections.GridItems();

griditems.fetch({
    error: function(e) {console.log(e);},
    success: function(msg) {
        console.log(msg)
    });
Run Code Online (Sandbox Code Playgroud)

当我控制日志时,msg我得到:对象{length = 0,models = [0],_ byId = {...},更多...}

我还在parse集合中记录了该函数,它通过JSON文件运行就好......任何关于这里可能出错的想法?msg对象的长度应为5..ie,即parse函数循环和(应该)将模型添加到集合的次数.

Tri*_*ote 18

处理这个问题的一个好方法是重新定义model属性,告诉集合如何将新模型添加到集合中,如此POST中所述:Backbone.js多个Model子类的集合(感谢@rulfzid,他回答了我的问题:))

在您的情况下,您应该能够像这样定义模型属性:

var VOR.Collections.GridItems = Backbone.Collection.extend({

  url: "assets/data/grid.json",

  model: function(attrs, options) {
    switch(attrs.type) {
      case "news":
        return new VOR.Models.NewsGridItem(attrs, options);
      default:
        return new VOR.Models.StandardGridItem(attrs, options);
    }
  }

});
Run Code Online (Sandbox Code Playgroud)


Jul*_*ien 0

// **parse** converts a response into a list of models to be added to the
// collection. The default implementation is just to pass it through.
parse : function(resp) {
  return resp;
},
Run Code Online (Sandbox Code Playgroud)

这就是文档所说的你应该在解析中执行的操作。无论您返回什么,都将被设置为集合起始数组。这是它被调用的地方:

  options.success = function(resp) {
    collection[options.add ? 'add' : 'refresh'](collection.parse(resp), options);
    if (success) success(collection, resp);
  }
Run Code Online (Sandbox Code Playgroud)

所以我建议将你的解析更改为:

return _.map(response, function(griditem){
    switch(griditem.type){
        case "news":
            return new VOR.Models.NewsGridItem(griditem);
            break;
        default:
            return new VOR.Models.StandardGridItem(griditem);
            break;
    }
});
Run Code Online (Sandbox Code Playgroud)