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

Question

我遇到了以下问题:我有一个 Controller ，我想过滤模型，例如:

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 不起作用，并在点击按钮时导致错误 Nothinghandled the event 'addToCart'。即使它是在 ProductController 中定义的。

现在这是有趣的部分:如果我不使用过滤结果，而仅使用我 View 中的 Controller 中的每个产品，则 addToCart 点击有效。我想我不明白 View 和 Controller 之间的关系，所以我感谢任何帮助。

谢谢!

Answer 1

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