Skip to content

Instantly share code, notes, and snippets.

@stefanpenner
Forked from evanphx/component.js
Last active February 10, 2016 00:18
Show Gist options
  • Save stefanpenner/9b0fbc0d009b8522ca5b to your computer and use it in GitHub Desktop.
Save stefanpenner/9b0fbc0d009b8522ca5b to your computer and use it in GitHub Desktop.
Ember observer
import Ember from 'ember';
export default Ember.Component.extend({
didInsertElement() {
this._super(...arguments);
// * if a computed property is never consumed, it will not be "active"
// * observers observe "active" things
// in most scenarios, computed properties are consumed often by templates (thereby typically observers appear to work without a manual kick)
// since this CP is not consumed naturally (it is essentially being consumed by a non-ember thing), we must give it a kick.
this.get('organizations.active.name'); // give it a kick, activating the CP. Although this is likely a smell itself, read further..
// Why is this the case?
// * merely observing something, should not have side-affects.
// * most applications, have many more unused computed properties then used computed properties
// it is worth noting, typically at this phase we will setup the external thing, which would naturally
// activate the CP chain. Leaving the observer to push changes after the initial "setup"
useName(this.get("organizations.active.name"));
},
organizations: Ember.inject.service("organizations"),
activeOrgChange: Ember.observer("organizations.active.name", function() {
// some pre-condition checking if the thing we want to communicate with is ready and still around (not torn down)
var name = this.get("organizations.active.name");
useName(name);
})
});
import Ember from 'ember';
export default Ember.Service.extend({
active: null,
activePage: null,
displayTopBarNav: false,
});
import Ember from 'ember';
export default Ember.Route.extend({
organizations: Ember.inject.service("organizations"),
model(params) {
let organizations = this.get("session.currentAccount.allOrganizations");
let organization = organizations.findBy('id', params.id);
return organization;
},
afterModel: function(model) {
this.set("organizations.active", model);
this.get("organizations.active");
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment