Ember.js EmberJS:刷新数据模型不会更新关联的计算属性

假设有一个路由，它能够在用户请求时更新其数据，假设后端为同一个调用返回不同的数据，可能是股票数据，或者只是随机数

export default Ember.Route.extend({
  model() {
    return this.get('store').findAll('foo');
  },

  actions: {
    invalidateModel() {
      this.refresh();
    }
  }
});

现在，直接使用此模型的组件将按预期更新其视图

Model: {{#each model as |m|}}{{m.bar}}{{/each}}
<button {{action "refreshModel"}}>Refresh model</button>

要获得完整复制，您可以查看：

最新提交是非工作计算属性案例。 问题是当直接使用模型时，一切仍然正常工作

---

我错过了什么

您的计算属性正在侦听对数组本身的更改。尝试侦听对具有模型的数组项所做的更改。[]

更新

表明上述解决方案解决了问题

如果它在您的端不起作用，那么您的api返回的内容就会出现一些问题

根据我关于如何发送操作的评论。您使用的是我不熟悉的2岁儿童

---

我建议您阅读

您的计算属性正在侦听数组本身的更改。尝试侦听对具有模型的数组项所做的更改。[]

更新

表明上述解决方案解决了问题

如果它在您的端不起作用，那么您的api返回的内容就会出现一些问题

根据我关于如何发送操作的评论。您使用的是我不熟悉的2岁儿童

我建议你读一读

关闭循环；来自@subletree的答案非常接近，这让我想到了正确的方向

差异很微妙，但足够重要，只有当返回的数据大小发生变化时，模型。[]才会起作用；添加或删除元素。在我的例子中，返回的数据的大小保持不变，只更新了它的值。所以正确的方法是监听您正在寻找的依赖键，在本例中是“model.@each.bar”

关闭循环；来自@subletree的答案非常接近，这让我想到了正确的方向

---

差异很微妙，但足够重要，只有当返回的数据大小发生变化时，模型。[]才会起作用；添加或删除元素。在我的例子中，返回的数据的大小保持不变，只更新了它的值。因此，正确的方法是听您正在寻找的依赖键，在本例中是“model.@each.bar”。

如果您还没有加入ember slack，您还应该加入：你试过这个吗？它不起作用：ember数据模型是一个类，而不是一个数组，至少不是直接在类中有数组。如果您没有正确地将操作发送到组件，那么您只是发送了一个字符串。请尝试{{foo component model=model invalidateModel=action invalidateModel}}。默认情况下，您不能将操作发送到模板，只能发送来自控制器或组件的操作。您可以使用ember route action helper加载项从路由发送操作组件的操作在路由中正常启动，请阅读问题并尝试运行示例。动作向上，数据向下。如果您还没有加入ember slack，您也应该加入：你试过这个吗？它不起作用：ember数据模型是一个类，而不是一个数组，至少不是直接在类中有数组。如果您没有正确地将操作发送到组件，那么您只是发送了一个字符串。请尝试{{foo component model=model invalidateModel=action invalidateModel}}。默认情况下，您不能将操作发送到模板，只能发送来自控制器或组件的操作。您可以使用ember route action helper加载项从路由发送操作组件的操作在路由中正常启动，请阅读问题并尝试运行示例。动作向上，数据向下。

Model: {{#each computedModel as |m|}}{{m}}{{/each}}
<br>
<button {{action "refreshModel"}}>Refresh model</button>

computedModel: Ember.computed('model', function() {
  return this.get('model').map(function(m) {
    return `Computed: ${m.data.bar}`;
  });
}),

computedModel: Ember.computed('model.[]', function() {
  return this.get('model').map(function(m) {
    return `Computed: ${m.data.bar}`;
  });
}),

computedModel: Ember.computed('model.@each.bar', function() {
  return this.get('model').map(function(m) {
    return `Computed: ${m.data.bar}`
  });
})