Ember.js - 匹配模型数据并在控制器中有很多关系

时间:2017-11-04 04:48:32

标签: ember.js ember-data

我正在尝试构建一个显示所有匹配数据的表组件。我不知道如何让这个工作。

我有多个平台,有很多市场。

模型很简单:

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

我可以显示复选框,以便用户可以选择要比较的平台并访问控制器中的ID。

如何从控制器中的模型中获取正确的记录?我不能在路线中这样做,因为它取决于选择的平台。

我可以使用Ember数据:

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

但我无法弄清楚如何进入市场。

我也尝试过枚举,但同样的问题:

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

在此之后,根据他们的名字获得匹配市场的干净方法是什么?

1 个答案:

答案 0 :(得分:1)

For your situation, you can access and compare the markets based on any selected platforms within your component. Each platform should have a relationship established to its associated markets within the model file. The relationship will allow you to access the markets off of the platform. For example, platform.get('markets') within a controller, component or {{platform.markets}} within a template. For a bit more detail on the rough process for implementing throughout the app files:

//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}}

Please reference the below link to an EmberTwiddle to see a rough (slightly hacky) example that might provide some better insight: https://ember-twiddle.com/364d9c04d37593f4a7c40cccf065a8fc?openFiles=routes.application.js%2C