Function
filter (dependentKey, callback) ComputedProperty public
Module:
@ember/object
Defined in packages/@ember/object/lib/computed/reduce_computed_macros.js:278
import { filter } from '@ember/object/computed'; |
- dependentKey
- String
- callback
- Function
- returns
- ComputedProperty
- the filtered array
Filters the array by the callback.
The callback method you provide should have the following signature.
item
is the current item in the iteration.
index
is the integer index of the current item in the iteration.
array
is the dependant array itself.
1 |
function(item, index, array); |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
import { filter } from '@ember/object/computed'; import EmberObject from '@ember/object'; let Hamster = EmberObject.extend({ remainingChores: filter('chores', function(chore, index, array) { return !chore.done; }) }); let hamster = Hamster.create({ chores: [ { name: 'cook', done: true }, { name: 'clean', done: true }, { name: 'write more unit tests', done: false } ] }); hamster.get('remainingChores'); // [{name: 'write more unit tests', done: false}] |
You can also use @each.property
in your dependent key, the callback will still use the underlying array:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
import { A } from '@ember/array'; import { filter } from '@ember/object/computed'; import EmberObject from '@ember/object'; let Hamster = EmberObject.extend({ remainingChores: filter('chores.@each.done', function(chore, index, array) { return !chore.get('done'); }) }); let hamster = Hamster.create({ chores: A([ EmberObject.create({ name: 'cook', done: true }), EmberObject.create({ name: 'clean', done: true }), EmberObject.create({ name: 'write more unit tests', done: false }) ]) }); hamster.get('remainingChores'); // [{name: 'write more unit tests', done: false}] hamster.get('chores').objectAt(2).set('done', true); hamster.get('remainingChores'); // [] |