JSON項目骨幹模型

我正在使用backbone.js。我得到一個JSON這樣的：JSON項目骨幹模型

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

FIRST_NAME和LAST_NAME通過PersonView（延伸Backbone.View）和家庭數據我想在一個DetailsView顯示顯示英寸

所以，我是這樣想的。第一張：

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

PersonView顯示不錯。然後我想模型傳遞到DetailsView控件這樣的：

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

好吧，當我嘗試將模型傳遞到DetailsView控件實現一個模板，像這樣：

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

我得到這個消息：

Uncaught TypeError: Object [object Object] has no method 'toJSON'

我不知道如何獲得或通過模型來解決這個問題。

我在嘗試幾種方法，但我無法完成它。

希望你能幫助我。

來源

2013-05-20 kobayashi

我覺得問題是因爲這一行。

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

該公司預計model是骨幹模型的實例。但我不認爲這是這裏的情況..嘗試定義模型家庭或以其他方式改變的關鍵

名稱，而不是嘗試這種方法

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

在你看來，你可以訪問此作爲

(this.options.familyMembers.toJSON())

來源

2013-05-20 18:54:48

完美，這是一個非常明顯的解決方案。當頭腦不清楚...... Thx，它解決了我的問題。 – kobayashi

@ kobayashi ..很高興有幫助:) –

「族系」屬性是一個數組，你可以做以下的一個...

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

來源

2013-05-20 20:19:53

問題是您傳入的模型只是一個數組。因此沒有.toJSON方法。由於授予建議您可以在創建視圖時使用新的Backbone.Model，但我建議使用一個集合和2個新的視圖爲家庭。它看起來像這樣。

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>

來源

2013-05-20 20:38:29

Thx，這是非常有益的... – kobayashi

JSON項目骨幹模型

回答

相關問題