Ember.observer starts at startup

Question

I am trying to create an Ember application without prototype extensions, and the Ember docs provide examples of how to do this, but they do not include an example of when I want my observer to run in init. So, if my code were written as follows:

fullNameChanged: function() { // deal with the change }.observes('fullName').on('init') 

The only example I can find for writing is this:

 Person.reopen({ fullNameChanged: Ember.observer('fullName', function() { // deal with the change }) }); 

So, how can I say that this code runs on init?

Answer 1

You may be looking for this

 Person.reopen({ fullNameChanged: Ember.on('init', Ember.observer('fullName', function () { // deal with the change })) }); 

OR (this will not be triggered by the handler if changes occur on init , use the above in this case)

 Person.reopen({ init: function(){ Ember.observer('fullName', function() { // deal with the change }); } }); 

Ok, this is the edit for error answers (?) Mentioned below

• Well, sometimes it may be necessary to start an observer during initialization .

• Ember.observer is an Ember namespace method, not a part of the Ember.Object prototype. Therefore this.observer never exists, but addObserver() does.

• No need to call a handler, Ember runtime will call a handler when the property changes

• calling this._super not needed if it really doesn't matter. In this case, if Person simply extends Ember.Object , calling super does nothing.

  By default, it does nothing if it is not redefined during class definition.

• This is contextual, and as long as the OP does not indicate anything about the definition of a class, it goes beyond the scope of the answer.

Nothing better than an example.

Answer 2

The accepted answer actually contains five separate errors of varying severity.

• This optionally sets the observer setting in hook init.

• It incorrectly sets the observer inside init , using Ember.observer instead of this.observer , which doesn't even work.

• It cannot invoke (as opposed to setting up) a handler during init.

• It cannot call init in a superclass.

• He uses reopen .

1. No need to configure observer in init hook

You do not need a procedural “call” or “call” in the initialization hook to configure the observer. Any of the following two forms will automatically install them when creating an instance of the object.

 fullNameChanged: function() { } . observes('fullName') observeFullNameChanged: Ember.observer('fullName', this.fullNameChanged.bind(this)) 

2. Use object.observer to procedurally configure observers.

If you did , you want to configure the observer procedurally, you call object.observer , not Ember.observer , which is defined to be used as described above. Calling Ember.observer procedurally does nothing; Amber will have no idea which property belongs to the property. In this case, it will be this.observer('fullName', ...) (although, as mentioned above, you don't need to do this at all, use the point 1 approach instead).

3. Calling the init handler

But you also want to call the handler at init time. There are three ways:

 init: function() { this.fullNameChanged(); /* call super */ } initFullNameChanged: Ember.on('init', this.fullNameChanged.bind(this)) fullNameChanged: function() { ... }.on('init') 

where the third option uses prototype extensions you don't want.

4. Call super from init

If you have an init hook, although it is not needed, you need to call super , or everything will break badly:

 init: function() { ... this._super.apply(this, arguments); } 

5 No need for reopen

reopen does nothing. Just put the above properties in the class definition itself.

Decision

The correct answer for what is equivalent

 fullNameChanged: function observer() { }.observes('fullName').on('init') 

so

 fullNameChanged: function() { }, observeFullNameChanged: Ember.observer('fullName', this.fullNameChanged.bind(this)), initFullNameChanged: Ember.on('init', this.fullNameChanged.bind(this)) 

This would be equivalent and perhaps more readable to do this:

 initFullNameChanged: Ember.on('init', function() { // define and execute handler (function fullNameChanged() { ... }()); // set up obsever this.observe('fullName, fullNameChanged); })