Ember.js：触发“Ember.computed.filter”以在控制器中的属性更改时进行更新

Question

我正在尝试根据来自文本输入的输入使用Ember.computed.filter 过滤 ArrayController 的内容。

App.IndexController = Ember.ArrayController.extend({
        filteredPeople: Ember.computed.filter('model',   function(person){
            var searchFilter = this.get('searchFilter');
            var regex = new RegExp(searchFilter, 'i');
            return person.firstName.match(regex);
        }),
        // this is bound to the value of a text input helper
        // I'm just pre-filling the value to show that the filtering does work
        searchFilter: 'kris' 
});

这很好用并且可以按预期过滤。但是，我希望它在 searchFilter 的值发生更改时更新（即，任何时候有人输入文本输入）。现在的问题是，它仅在模型本身发生更改或控制器首次加载时才会更新。

当searchFilter 更新时，是否有触发Ember.computed.filter 更新？我正在使用Ember.computed.filter，因为它似乎比普通的计算属性更有效，我相信每次都会重新创建整个数组（如果我弄错了，请告诉我）。此外，Ember.compute.filter 简单易用且非常干净！

我使用上述设置创建了一个 JSBin。当用户输入文本框时，我想以某种方式触发Ember.computed.filter 进行自我更新。

http://emberjs.jsbin.com/pitefica/1/edit

感谢您的时间和任何帮助。

Answer 1

也许太简单了，但是 Ember.computed.filter 支持使用 .property() 的依赖键，所以这会很好：

App.IndexController = Ember.ArrayController.extend({
        filteredPeople: Ember.computed.filter('model',   function(person){
            var searchFilter = this.get('searchFilter');
            var regex = new RegExp(searchFilter, 'i');
            return person.firstName.match(regex);
        }).property('model','searchFilter'),
        searchFilter: 'kris' //this is bound to the value of a text input helper
});

jsbin：http://emberjs.jsbin.com/tefes/1/edit

Answer 2

我不确定您将如何使用Ember.computed.filter 来执行此操作。 使用Ember.Array.filter 方法和计算属性很容易实现：

searchFilter: 'kris',

filteredPeople : function(){
    var content = this.get('content'),
        searchFilter = this.get('searchFilter'),
        regex = new RegExp(searchFilter, 'i');

    return content.filter(function(person){
        return person.get('firstName').match(regex);
    });
}.property('content.@each', 'searchFilter')

现在，每当content 数组中的某些内容发生更改或searchFilter 更改值时，都会重新计算filteredPeople。

JSBin：http://emberjs.jsbin.com/pitefica/6/edit