Solution
In the last drip we were tasked with converting a few simple observers into computed properties. Let's look at how we can accomplish that.
The first observer looked like this:
formHasUpload: Ember.observer('upload', function() {
if(Ember.isPresent(this.get('upload'))) {
this.set('needsUpload', false);
}
})
This is a fairly straight forward port. As we can see, we are watching the
upload
property and if it exists, we are setting a property called
needsUpload
to false. We can assume that
needsUpload
defaults to true. To
get this work without an observer, all we need to do is change
needsUpload
to
be a computed property.
needsUpload: Ember.computed('upload', function(){
return Ember.isBlank(this.get('upload'));
})
The second example is essentially the same as the first.
resetOnSave: Ember.observer('resetChecks', function() {
let reset = this.get('resetChecks');
if(reset){
this.set('isSelected', false);
}
})
It observes the
resetChecks
property and if it is truthy, it sets
isSelected
to false. Again, all we really need to do is change
isSelected
to be a
computed property that has
resetChecks
as its key.
isSelected: Ember.computed('resetChecks', function(){
return !this.get('resetChecks');
})
These examples were obviously pretty simple, but they were embarrassingly similar to real life observers that I have uncovered in the wild. In most cases, if you find an observer, even a more complicated one, you can generally untangle it to take advantage of Ember's lifecycle hooks and computed properties.
Prep
This week we are going to look at some more devops part of the Ember process, namely, fastboot and simple process for deploying your app. Here are some links that will give you a head start in that direction.
Comments for Solution and Prep