javascript - Ember.js过滤内容并使用按钮 Action

我遇到了以下问题：我有一个控制器，并且想要过滤模型，例如：

App.ProductsController = Ember.ArrayController.extend({
  itemController: 'product',

  filteredContent: function(query) {
    var query = this.get('query')

    var products = this.get('content').filter(function(item) {
      return true // Condition goes here
    })

    return products
  }.property('query')
})

我认为哪个工作正常：

{{#each product in filteredContent}}
  ...
  <h1>{{product.name}}</h1>
  ...
  <button {{action addToCart}}>Add to cart</button>
{{/each}}

至少就循环而言。按下按钮时，操作addToCart不起作用，并导致错误Nothing handled the event 'addToCart'。即使它在ProductController中定义。

现在，这是有趣的部分：如果我不使用过滤的结果，而只是在我的视图中使用each product in controller，则单击addToCart即可。我想我不了解视图和控制器之间的关系，因此，我感谢您的帮助。

谢谢！

最佳答案

使用{{#each item in items}}语法does not change the binding scope。因此，您已绑定到product.name。如果addToCart在ProductController中而不在ProductsController中，则需要将操作绑定编写为action addToCart target="product"。