Open In App

Ember.js Application register() Method

Improve
Improve
Like Article
Like
Save
Share
Report

Ember.js is a JavaScript web framework that utilizes a component-service pattern. It is Open-Sourced. The Ember Js Applications Class provides a registered facility that binds objects to the application level dependencies. The dependencies then can be used by the user in other sections and the binding is handled by ember.

Syntax:

application.register('factory:name',object,options)

Attributes: The register function  has three attributes that are used to define its execution process:

  1. factory:name: The factory defines the factory framework which is to be used, and the name specifies the name of the factory.
  2. object: It specifies the object which is to be binded to the given ‘factory:name’
  3. options: These are optional attributes, which have generally singleton and non-singleton types. A singleton object will be instantiated once, and whenever it is looked up the same instance is returned.  Non-Singleton types have a new instance of the object returned every time.

Create An Ember App: Now we need to create an Ember app. Go to the directory where you want to save the application and run the command:

ember create my-app

Create Ember Application

Example 1: First we will use singleton-type objects and by default, if we do not specify options, singleton objects are used.

Now Run the following command:

ember generate instance logger

Now add the following code into file logger.js: Here We are first importing the ‘Emberobject’ which we will use to extend the functionality of our custom declared object logger. Next is the initialize function which describes what steps to perform during the initialization of this object. We have the application.register() function ,which is registering the objects .Third and final part is setting default properties like name and the initialize function.

Javascript




import EmberObject from '@ember/object';
  
export function initialize(application) {
  let Logger = EmberObject.extend({
    log(m) {
      console.log(m);
    },
  });
  
  application.register('logger:main', Logger);
}
  
export default {
  name: 'logger',
  initialize: initialize,
};


Run the command: 

 ember generate instance-initializer instancelogger

Now copy the following code into the instancelogger.js file: here we are defining what this instance initializer will perform when instantiated, the lookup method is used to get a reference to the initializer logger declared above and use it. The two different logger objects are used to compare whether the same reference is the same or different.

Javascript




export function initialize(applicationInstance) {
  let logger = applicationInstance.lookup('logger:main');
  logger.log('This is log from Instance Logger1!');
  let logger2 = applicationInstance.lookup('logger:main');
  logger2.log('This is log from Instance Logger2!');
  
  // To check returned instance is equal or not
  logger.log(logger ==logger2);
}
  
export default {
  initialize
};


Run the command: 

 ember server 

Output: Go to localhost:4200 and check the console log. As u will notice the output in the log will return ‘true’ means logger and logger2 are both objects are the same instances.

Ember Application.register Output 1

Example 2: Now we will make our registry non-singleton. To do this we will add {singleton : false} in the option’s attributes in the register function. So Update the logger.js with the following code: Here We are first importing the ‘Emberobject’ which we will use to extend the functionality of our custom declared object logger. Next is the initialize function which describes what steps to perform during the initialization of this object. We have the application.register() function, which is registering the objects in which we set singleton property as false. Third and final part is setting default properties like name and the initialize function.

Javascript




import EmberObject from '@ember/object';
  
export function initialize(application) {
  let Logger = EmberObject.extend({
    log(m) {
      console.log(m);
    },
  });
  
  application.register('logger:main', Logger,{singleton:false});
}
  
export default {
  name: 'logger',
  initialize: initialize,
};


The instancelogger.js file remains the same.

Output: Go to localhost:4200 and refresh the page or reload.

Ember Application.register Output 2



Last Updated : 10 Jul, 2022
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads