#102 Computed Macro

Update: I made some corrections based on comments.

Let’s say you want to create a computed property to upper case another property, for example:

first: '',
upperFirst: Ember.computed('first', function(){
return this.get('first').toUpperCase();
})

Let’s say you want to use this “upper” function in multiple places, you can convert it into a “computed macro”.

Create a macro in a subfolder e.g. utils or macros:

app/macros/upper.js

Create the helper:

import Ember from 'ember';

const { get,computed } = Ember;

export default function (key) {
return computed(key, function(){
let value = get(this,key);
return value.toUpperCase();
});
}

Now, you can use that computed macro like this:

upperFirst: upper('first'),

Don’t forget to import it:

import upper  from '../macros/upper';

This tip was inspired by the ember-awesome-macros addon.


Originally published at Ember Daily Tips.