Emberjs equivalent to Angular filter ng model search

Question

Is there an easy way to apply a search filter like angular:

<input type="text" ng-model="resultFilter" placeholder="Search">

<ul>
    <li ng-repeat="result in results | filter:resultFilter">{{result.name}}</li>
</ul>

this filters the result by what ever is typed in the input box making an awsomely simple search feature. Is there a simple Emberjs equivalent or this one of those simple perks of anuglarjs?

Answer 1

You can use Ember.computed.filter to dynamically filter your model.

App.IndexController = Ember.Controller.extend({
   searchKeyword: '',

   searchResults: Ember.computed.filter('model', function(model) {
       return model.filterProperty('name', this.get('searchKeyword'));
   }).property('model', 'name')
});

with example template

{{input type="text" valueBinding="searchKeyword"}}

<ul>
{{#each result in searchResults}}
   <li>{{result.name}}</li>
{{/each}}
</ul>