Javascript JSON项到主干模型

我正在使用backbone.js。我得到的json如下：

{
    first_name: 'David',
    last_name: 'Smith',
    family: [{father: 'David', mother: 'Rose', brother: 'Max'}]
}

detailsView = new DetailsView(model: JSON.parse(person.get('family'));

DetailsView = Backbone.View.extend({
    className: 'tab-pane',
    template: _.template($('#detail-tpl').html()),
    render: function(){
        this.$el.html(this.template(this.model.toJSON()));
        return this;
    },
});

名字和姓氏通过PersonView（扩展Backbone.View）和我想在DetailsView中显示的家庭数据显示

所以，我试着这样做。第一:

personView = new PersonView(model: person)//person it's the json above

PersonView表现得很好。然后我想将模型传递给DetailsView，如下所示：

{
    first_name: 'David',
    last_name: 'Smith',
    family: [{father: 'David', mother: 'Rose', brother: 'Max'}]
}

detailsView = new DetailsView(model: JSON.parse(person.get('family'));

DetailsView = Backbone.View.extend({
    className: 'tab-pane',
    template: _.template($('#detail-tpl').html()),
    render: function(){
        this.$el.html(this.template(this.model.toJSON()));
        return this;
    },
});

当我尝试在DetailsView实现中将模型传递给模板时，如下所示：

{
    first_name: 'David',
    last_name: 'Smith',
    family: [{father: 'David', mother: 'Rose', brother: 'Max'}]
}

detailsView = new DetailsView(model: JSON.parse(person.get('family'));

DetailsView = Backbone.View.extend({
    className: 'tab-pane',
    template: _.template($('#detail-tpl').html()),
    render: function(){
        this.$el.html(this.template(this.model.toJSON()));
        return this;
    },
});

我得到这个信息：

未捕获的TypeError:对象[Object Object]没有方法“toJSON”

我不知道如何获得或通过模型来解决这个问题

我试了好几种方法，但都做不到

---

希望你能帮助我。

我想问题是因为这条线路

model: JSON.parse(person.get('family')

它希望

model

是主干模型的一个实例。但我认为这里的情况不是这样。。请尝试为族定义模型，或者更改键的名称

相反，尝试这种方法

familyMembers : JSON.parse(person.get('family')

在您的视图中，您可以通过

(this.options.familyMembers.toJSON())

“family”属性是一个数组，您可以执行以下操作之一

var familyArray = model.get('family');
new DetailsView({model: new Backbone.Model(familyArray[0])});

…或将getFamily函数添加到人物模型

var PersonModel = Backbone.Model.extend({
    getFamily: function() {
        var familyArray = this.get('family');
        return new Backbone.Model(familyArray[0]);
    }
});

...

new DetailsView({model: person.getFamily()});

---

问题是您传递的模型只是一个数组。因此没有.toJSON方法。正如grant所建议的，您可以在创建视图时使用新的主干.Model，但我建议为该族使用一个集合和两个新视图。它看起来像这样

    var PersonModel = Backbone.Model.extend({
     initialize: function(attributes, options) {
      if(attributes.family) {
       this.family = new FamilyCollection(attributes.family, options);
      }
     }
    });

    var FamilyCollection = Backbone.Collection.extend({
     model: FamilyMember,
     initialize: function(models, options) {
      this.view = new FamilyView(options);
     }
    });

    var FamilyMember = Backbone.Model.extend({
     initialize: function(attributes, options) {
      this.view = new DetailedView({
       model: this


    });
     }
});

然后，您将使用类似这样的视图结构

<div class="person">
 <span class="name-first">David</span> <span class="name-last">Smith</span>
 <div class="family-members>
  <div class="family-member">
    <span class="name-first">Rose</span> <span class="name-last">Smith</span>
  </div>
  <div class="family-member">
    <span class="name-first">David</span> <span class="name-last">Smith</span>
  </div>
  <div class="family-member">
    <span class="name-first">Max</span> <span class="name-last">Smith</span>
  </div>
 </div>
</div>

大卫·史密斯
很好，这是一个非常明显的解决方案。当头脑不清楚的时候……Thx，它解决了我的问题。@kobayashi。。很高兴能帮忙：）