レンダリング前にデータを変更する

Question

以下の例でテンプレートをレンダリングする前にデータを変更する適切な方法は何ですか？私のルートから

model()：

私のテンプレートで次に

model({contractId}){ 
    const cities = this.store.query('city', {contractId}); 
    return Ember.RSVP.hash({ cities}); 
    } 

：

{{orders/order-form cities=model.cities}} 

そして最後に、私のコンポーネントで、私は都市で何かを変更したいのですが、私はで計算されたオブジェクトを作成しましたこの方法：

cityOptions: Ember.computed('cities', function(){ 
    return this.get('cities').map((data)=> ({key: data.id, value: data.name})); 
    }), 

しかし、this.get('cities')は次のようなものを返します。データの代わりにClass {modelName: "city", query: Object, store: Class, manager: RecordArrayManager…}誰もがthis.get('cities')から純粋なデータを取得するクールな方法を知っていますか？どんな助けもありがとう。

Answer 1

これは動作するはずです：

import Ember from 'ember'; 

const {get} = Ember; 

export default Ember.Component.extend({ 

    cityOptions: Ember.computed('cities.@each.name', 'cities.@each.id', function(){ 
    return this.get('cities').map((city) => ({ 
     key: get(city, 'id'), 
     value: get(city, 'name'), 
    })); 
    }), 
}); 

をここで重要なことはcitiesが燃えさしのデータオブジェクトの燃えさしの配列であること、です。通常のプレーンなJSオブジェクトではないので、obj.propの代わりにEmber.get(obj, 'prop')またはobj.get('prop')を使用する必要があります。

Answer 2

あなたはいつものようにtoJSON（）を使用することができます... this.get('cities').toJSON() 都市はあなたがPOJOをしたい場合、あなたはそれを変換する必要があり、DS.modelの配列です。

cityOptions: Ember.computed('cities', function(){ return 
    this.get('cities').map((aModel)=> ( 
    return aModel.toJSON().map((data)=> (
     return {key: data.id, value: data.name})) 
    )); 
}),