Ember.js如何正确过滤组件中的模型

Question

我有以下自动完成组件：EmberCasts的初步想法：构建自动完成小工具第1部分

App.AutoCompleteComponent = Ember.Component.extend({
    searchText: null,
    searchResults: function() {
        var model = this.get('model');
        var searchText = this.get('searchText');
        console.log(this.get('model')); // shows array
        if (searchText){
            console.log('searching for: ' + searchText); // shows up in console with searchText
            var regex = new RegExp(searchText, 'i');
            model = model.filterBy('name', function(name) {
                console.log(name); // never got reached
                return name.match(regex);
            });
        }
        return model;
    }.property('searchText')
});

我的模板:

{{auto-complete model=controllers.categories}}
<script type="text/x-handlebars"s data-template-name="components/auto-complete">
    {{input type="text" value=searchText placeholder="Search..."}}
    <ul>
        {{#each searchResults}}
        <li>{{this}}</li>
        {{/each}}
    </ul>
</script>

问题是，没有返回任何模型项。在程序的初始状态下，我的所有类别都会显示出来——我很快就会解决这个问题。但它向我表明，自动完成组件确实有效。模型一开始确实会被退回。我认为FilterBy没有达到我预期的效果。

我已经尝试将FilterBy部分更改为此，并精确搜索名称：

model = model.filterBy('name', searchText);

但这也没有奏效。有什么想法吗？

Answer 1

您的第二种方法是使用filterBy的正确方法，如果您想传递函数，您可以使用filter。

model = model.filterBy('name', searchText);

我打赌你们的模型上并没有这个名字，或者类似的东西。如果您需要更多帮助，请向我们展示类别模型的示例。

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

您需要使用过滤器

http://emberjs.jsbin.com/oTIxAjI/4/edit