Angular.js is a MVC based JavaScript framework which provides client-side modularity using Angular components like Module, Controller, Services, Factory etc. A Module is an entry point to the Angular application, whereas the Controller contains objects which are used to bind with the View using Angular Directives.
For Services, the general assumption is that if one or more angular controllers wants to access data from an external REST service or a Web API, then we use an Angular service. Let's see some specifications of using Angular Service and Factory.
Angular.js Service
Here are some specifications of the Angular Service object:
- These are substitutable objects that are wired together using dependency injection.
- This is a constructor function which creates an object using new keyword.
- They are lazily instantiated instances, this means that angular will only instantiate a service when the component is dependent on it.
- This can be injected in the angular controller. Each component dependent on the service gets reference to the single instance generated by service factory.
- This is used for containing simple logic which we want to share across all controllers.
- This acts as a reusable component in the client-side code.
- This does not return anything.
The following is the syntax of the Angular Service
var app = angular.module('mymodule',[]); app.service('crudserv', function ($http) { this.getEmployees = function () { }; this.post = function (employee) { }; this.put = function (id,employee) { var promise = $http({ }; this.delete = function (id) { }; }); - The service defines all functions and properties using this
- When the service name is declared as injectable argument to the component, is it provided with an instance of the function. It is just like declaring an instance using new keyword.
Angular.js Factory
Here are some specifications of the Angular Factory object:
- This is an object declaration with properties and functions. This is like declaring a function returning value.
- When the factory is passed to the controller, all properties and functions are available in that controller.
- Factory is reusable component with all its contents (functions, properties, etc.)
- This is Singleton and be created only once.
- This is the most suitable and recommended component to share data across controllers.
- Factory can have other dependencies e.g. other factories.
- Factory can be used as a Service when we need a single repository to place complex logic in it.
The syntax is as follows:
var app = angular.module('mymodule',[]); app.factory('testfact', function () { return { value:0 } }); The factory object returns an object.
The advantage of using factory is that, we can have typical coding style of declaring private and public functions like a class. So we can hide a specific functionality form direct access from the injectable components.
One major difference between Angular.js Service and Factory is a Service is a constructor function, whereas a Factory is not. If we use service() or factory(), internally a factory always gets called which in turn creates a provider for our service.
Whether to use Factory or Service is purely a coding standard choice. A Factory is more preferred because of its class like definition whereas Service are used when we are using ES6 classes or when we plan to migrate to ES6.
To learn more, check out our AngularJS Tutorials and CheatSheets.
No comments:
Post a Comment