Question

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

我查看了Ember Inspector，Data选项卡。新添加的项目已附加到列表中。那么，如果在数据存储中反映出来，它也不应该在模板中反映/渲染吗？

新添加的项目也保留在数据库中。

如果我将路线中的模型挂钩更改为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>

Answer 1

要自动同步新记录，您应使用store.filter代替store.find。有关详细信息，请查看ember文档：http://emberjs.com/api/data/classes/DS.Store.html#method_filter

Answer 2

也许这是你的setupController方法。 setupController的默认行为是设置model的{{1}}属性。在此，您只需controller。

虽然这应该将值初始设置为正确的控制器值，但它可能只是将这些值设置为Ember Arrays，因此他们不知道您创建了一个新项目。

创建项目后（甚至在保存项目后），您应该尝试通过调用类似setProperties的内容将其添加到控制器的items数组中。

Answer 3

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

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

{ items: [your items..]}

这意味着你不能说这个.addItems（项目），你必须说这个。（＆＃39; model＆＃39;）。items.pushObjects（items）。< / p>

您的路线只能有一个＆＃34;型号＆＃34;，如果它是一个哈希值，那么物品只是该哈希值上的一个键。

Answer 4

你可能会打断诺言的决议。尝试类似：

＆＃13;

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

＆＃13;

为什么模板中新添加的项目不呈现？

4 个答案: