this.store.query更新组件列表

时间:2015-11-10 12:31:44

标签: ember.js ember-data ember-cli

如何在将新ID传递给组件时更新this.store.query?即。

// application / template.bs

 // Generic ember link-to passing the dashboard id
  <ul class="dropdown-menu">
      {{#each dashboard.service as |dashboard|}}
          <li>
            {{#link-to 'dashboard' dashboard}}{{dashboard.dashboard_name}}{{/link-to}}
          </li>
      {{/each}}
   </ul>

// dashboard / template.hbs

<h1>{{model.dashboard_name}}</h1>
{{widget-list dashboard_id=model.id}}

// components / widget-list / template.hbs

{{#each widgets as |widget|}}
  {{widget-base widget=widget}}
  {{else}}
    <small>No widgets for this dashboard</small>
{{/each}}

// components / widget-list / component.js

import Ember from 'ember';

export default Ember.Component.extend({
  widgets: Ember.computed(function() {
    var widgets = this.store.query('widget', {
      dashboard: this.get('dashboard_id')
    });
    return widgets;
  }),
});

基本上我正在查看附有小部件的不同仪表板。单击我的仪表板链接时,model.dashboard_name将更新,但小部件保持不变。如果我硬刷新,它们会更新,但我需要在单击每个仪表板链接时使用新的小部件列表进行更新。出于某种原因,这种情况并没有发生。

任何人都可以提供修复或一些关于我需要做什么的信息吗?

1 个答案:

答案 0 :(得分:1)

您可以观看dashboard_id属性:

export default Ember.Component.extend({
  widgets: Ember.computed('dashboard_id', function() {
    var widgets = this.store.query('widget', {
      dashboard: this.get('dashboard_id')
    });
    return widgets;
  }),
});