2017-11-04 11 views
0

すべての一致するデータを表示するテーブルコンポーネントを作成しようとしています。私はこの仕組みをどうやって得るのか分かりません。Ember.js - モデルデータが一致し、コントローラに多くの関係がある

多くのMarketsを持つ複数のプラットフォームがあります。

モデルは簡単です:ユーザがコントローラにIDを比較し、アクセスするために、どのようなプラットフォームを選択することができますので、

model() { 
    return this.store.findAll('platform', {include: 'markets'}); 
} 

私はチェックボックスを表示することができます。

コントローラーのモデルから正しいレコードを取得するにはどうすればよいですか?私はこのルートでこれを行うことはできません。なぜなら、どのプラットフォームが選択されているかによって異なります。

this.get('store').findRecord('platform', id, {include: 'markets'}) 

をしかし、私は市場にアクセスする方法を見つけ出すことはできません。

私はエンバーデータを使用することができます。

私もenumerablesを試してみましたが、同じ問題:この後

this.get('model').filterBy('id', id) 

、その名前に基づいてマッチング市場を取得するためのクリーンな方法は何ですか?

答えて

1

お客様の状況に応じて、コンポーネント内の選択したプラットフォームに基づいてマーケットにアクセスし、比較することができます。各プラットフォームは、モデルファイル内の関連市場との関係を確立する必要があります。この関係により、プラットフォームから市場にアクセスできるようになります。たとえば、コントローラー、コンポーネント内のplatform.get('markets')、テンプレート内の{{platform.markets}}などです。アプリのファイルを通じて実装するためのラフなプロセス上のビットの詳細について: https://ember-twiddle.com/364d9c04d37593f4a7c40cccf065a8fc?openFiles=routes.application.js%2C

//Within the platform.js model just to set the basic relationship 
markets: hasMany(), 

//Within your controller.js build an array of selected platforms 
selectedPlatforms: null, 

actions: { 
    selectPlatform(platform) { 
    this.get('selectedPlatforms').pushObject(platform); 
    }, 
} 

//Within your template.hbs provide your component the array 
{{matching-markets platforms=selectedPlatforms}} 

//Within your component.js compare the platform markets 
platforms: null, 

matchingMarkets: computed('platforms', function() { 
    const platform1Markets = this.get('platforms.firstObject.markets'); 
    const platform2Markets = this.get('platforms.lastObject.markets'); 
    return /* Compare platform1Markets against platform2Markets */; 
}), 

// Within the component.hbs 
{{#each matchingMarkets as |market|}} 
    {{market.name}} 
{{/each}} 

いくつかのより深い洞察を提供するかもしれない(少しハック)ラフの例を見てEmberTwiddleへ下記のリンクを参照してください。

関連する問題