Ember.js 为什么新添加的项不在模板中呈现？

到目前为止，我的groupedItems已在模板中正确呈现。但是当我点击addToCart链接时，它会触发addToCart操作。模板不会呈现新项。。。我必须手动刷新页面才能看到它

我检查余烬检查器，数据选项卡。新添加的项目已附加到列表中。那么，如果在数据存储中进行反射，它不也应该在模板中进行反射/渲染吗

新添加的项也被保存在数据库中

如果我将路由中的模型挂钩更改为items:this.store.find'item，而不是items:this.store.find'item'，{status:'queued'}。一切正常

我怀疑这就是我的计算属性groupedItems的管理方式。有什么建议吗

// Routes
import Ember from 'ember';

export default Ember.Route.extend({
  model: function() {
    return Ember.RSVP.hash({
      // items: this.store.find('item'),
      // items: this.store.find('item').filterBy('status', 'queued'),
      items: this.store.find('item', { status: 'queued' }),
      // products: this.store.find('product', { status: 'available' })
    });
  },

  // You can use model.items to get items, etc
  // Since the model is a plain object you can just use setProperties
  // http://stackoverflow.com/questions/16463958/how-to-use-multiple-models-with-a-single-route-in-emberjs-ember-data
  setupController: function(controller, model) {
    // model.reload;
    controller.setProperties(model);
  },

  actions: {
    addToCart: function(product) {
      var _this = this;

      var item = _this.store.createRecord('item');
      item.set('product', product);

      item.save().then(function() {
        // _this.transitionTo(fromRoute);
      });
    }
  }
});

// Controller
import Ember from 'ember';

export default Ember.Controller.extend({
  groupedItems: function () {
    var result = [];

    this.get('items').forEach(function(item) {
    // this.get('items').filterBy('status', 'queued').forEach(function(item) {
      var hasProductId = result.findBy('productId', item.get('product.id'));

      if(!hasProductId) {
         result.pushObject(Ember.Object.create({
            productId:        item.get('product.id'),
            product:          item.get('product'),
            item:             item,
            numberOfProducts: 0,
            subtotalInCents:  0
         }));
      }

      var productFromResult = result.findBy('productId', item.get('product.id'));

      productFromResult.set('numberOfProducts', productFromResult.get('numberOfProducts') + 1);

      item.get('product').then(function(product){
        productFromResult.set('subtotalInCents', productFromResult.get('subtotalInCents') + product.get('amountInCents'));
      });
    });

    return result;
  }.property('items.@each')
});

// Template / hbs
<ul>
  {{#each groupedItems}}
    <li>
      <a href="#" {{action "addToCart" product}}>Add</a>
      / <a href="#" {{action "removeFromCart" item 'index'}}>Remove</a>
      {{numberOfProducts}} {{product.name}} P{{cents-to-pesos product.amountInCents}} / each
    </li>
  {{/each}}
</ul>

---

你可能会打断承诺的决议。尝试以下方法：

item.save.thenfunctionresult{ 返回结果； //_这是从路线的过渡； }; 也许这是你的setupController方法。setupController的默认行为是设置控制器的模型属性。在这里，您只需设置属性

虽然这应该首先将值设置为正确的控制器值，但它可能只是将这些值设置为余烬数组，因此他们不知道您创建了一个新项

---

创建项目后，甚至保存项目后，您应该尝试将其添加到控制器的项目数组中，方法是调用类似以下内容。get'items'。pushObjectitem。

您的问题是，您的模型是RSVP.hash的结果

这意味着您的控制器模型如下所示：

{ items: [your items..]}

这意味着你不能这么说。addItemsitems，你必须这么说。获取'model'。items.pushObjectsitems

---

您的路由只能有一个模型，如果它是散列，则项目只是该散列上的一个键。

要自动同步新记录，应使用store.filter而不是store.find。查看余烬文档了解更多详细信息：

console.logthis.get'items'；我把它放在我的addToCart动作中，我就没有定义。知道为什么吗？在模型钩子中有项：this.store.filter'item'，functionitem{return item.get'queued'；}。然后functionqueuedtems{return queuedtems；}在模型钩子中甚至不会触发对items端点的API请求尝试使用项：this.store.filter'item'，{status:'queued'}，functionitem{return item.get'status'='queued'}.store.find还允许您在其中加入过滤器。它让你思考。store.find在添加新项目时无法更新存储时的全部意义是什么？