belongsToモデルの計算プロパティは未定義です

Question

私は3つのモデルを持っています。

// Product 
export default DS.Model.extend({ 
    content: DS.attr('string'), 
    creator: DS.belongsTo('user') 
}); 

// User 
export default DS.Model.extend({ 
    email: DS.attr('string'), 
    products: DS.hasMany('product'), 
    person: DS.belongsTo('person'), 
    fullName: Ember.computed(function() { 
     return `${this.get('person.firstname')} ${this.get('person.surname')}`; 
    }) 
}); 

// Person 
export default DS.Model.extend({ 
    firstname: DS.attr('string'), 
    surname: DS.attr('string'), 
    users: DS.hasMany('user') 
}); 

私はハンドルバーでこれを使用しようとしています。

{{#each products as |product|}} 
    {{product.creator.fullName}} 
{{/each}} 

あなたはUserモデルで計算されたプロパティがある見ることができるように。しかし、とthis.get('person.surname')が返されるため、常にundefined undefinedを返します。

Emberインスペクタは、各モデルのデータを表示します。どのようにこれを修正するための任意のアイデア？

Answer 1

リレーションシップはデフォルトで非同期で、promisesを返します。これは、あなたがそれを尋ねた瞬間にあなたがデータを持っていないことを意味します。最初にデータを読み込むときに読み込まれ、に従属キーを追加してPersonモデルが解決されたときに更新するには、fullNameを更新する必要があります。

PS。 ember-promise-helpersのようなアドオンを見て、テンプレートに非同期データを整理することができます。

// User 
export default DS.Model.extend({ 
    email: DS.attr('string'), 
    products: DS.hasMany('product'), 
    person: DS.belongsTo('person'), 

    fullName: Ember.computed('person.{firstname,surname}', function() { 
     return `${this.get('person.firstname')} ${this.get('person.surname')}`; 
    }) 
}); 

// Person 
export default DS.Model.extend({ 
    firstname: DS.attr('string'), 
    surname: DS.attr('string'), 
    users: DS.hasMany('user') 
});