
ember-enhanced-computed
Enhanced the user experience of the Ember.computed
function just a little bit.
Installation
ember install ember-enhanced-computed
Usage
Dependent keys are passed into the function as arguments
import computed from 'ember-enhanced-computed';
let person = {
first: 'Rob',
last: 'Jackson',
name: computed('first', 'last', function(first, last) {
return `${first} ${last}`;
})
};
person.get('name');
get / set style is also supported
import computed from 'ember-enhanced-computed';
let person = {
first: 'Rob',
last: 'Jackson',
name: computed('first', 'last', {
get(first, last) {
return `${first} ${last}`;
},
set(value ) {
let [first, last] = value.split(' ');
this.set('first', first);
this.set('last', last);
return value;
}
})
};
person.get('name');
person.set('name', 'Stefan Penner');
person.get('name');
When a dependent key uses the @each macro, the array before the macro is passed in
import computed from 'ember-enhanced-computed';
let crowd = {
people: [
{ name: 'Rob Jackson' },
{ name: 'Stefan Penner' }
],
names: computed('people.@each.name', function(people) {
return people.map((person) => person.get('name'));
});
};
crowd.get('names')
'person.{first,last}' passes first and last of person as arguments
import computed from 'ember-enhanced-computed';
let post = {
author: {
first: 'Rob',
last: 'Jackson',
}
authorName: computed('author.{first,last}', function(first, last) {
return `${first} ${last}`;
})
};
post.get('authorName');