AngularJS (38 Blogs) Become a Certified Professional

Everything you Need to Know About Factory in AngularJS

Published on Sep 13,2019 11 Views

MI-new-launch

myMock Interview Service for Real Tech Jobs

myMock-mobile-banner-bg

myMock Interview Service for Real Tech Jobs

  • Mock interview in latest tech domains i.e JAVA, AI, DEVOPS,etc
  • Get interviewed by leading tech experts
  • Real time assessment report and video recording

AngularJS provides services that are reusable singleton objects. They can be used to share the code across the users AngularJS applications. They can also be injected into directives, filters, and controllers. In this article, we will understand the factory in AngularJS.

 

What is Factory in AngularJS?

Factory is an angular function which is used to return the values. A value on demand is created by the factory, whenever a service or controller needs it. Once the value is created, it is reused for all services and controllers.

Angular Logo - Factory in AngularJS

We can use the factory to create a service.

 

Difference Between Service and Factory

  • A service can be defined in the following way:

app.service('FirstService', function () {

this.sayHola = function () {

console.log('Hola');

};

});

The .service() method takes the name and the function that defines the service. We can inject it in the following way:

app.controller('AppController', function (FirstService) {

FirstService.sayHola(); // logs 'Hola'

});

 

  • A factory, on the other hand can be defined in the following way:

app.factory('FirstService', function () {

return {

sayHola: function () {

console.log('Hola');

}

}

});

 

factory() is also a method that takes a name and function that defines the factory. We can inject it in the same way as injecting a service. The major difference between a service and factory is that we return an object literal in the case of factory (instead of using this). The reason is that service is a constructor function whereas a factory is not.

  • For a better understanding, let’s take a look at the factory function():

function factory(name, factFn, enforce) {

return provider(name, {

$get: enforce !== false ? enforceReturnValue(name, factFn) : factFn

});

}

In the code given above, it takes the name and the passed factory function. It returns a provider with the same name, along with a $get method(which is the factory function) . This is due to the reason that whenever the injector is asked for a specific dependency, the injector asks the provider for an instance of that service by calling the $get() method.

 

  • On injecting FirstService, the factory functions get called:

FirstServiceProvider.$get(); // return the instance of the service

 

  • For the service code:

function service(name, constructor) {

return factory(name, ['$injector', function($injector) {

return $injector.instantiate(constructor);

}]);

}

When we call service(), factory() is the one that is actually called. This is done by passing a function that asks the injector to instantiate an object by the constructor. In simpler terms, service calls a predefined factory.

$injector.instantiate() calls the Object.create() with the constructor function. That is why this is used in services.

 

Example of Factory in JavaScript

var firstModule = angular.module("firstModule", []);

firstModule.factory("firstFactory", function() {

return "a value";

});

firstModule.controller("FirstController", function($scope, firstFactory) {

console.log(firstFactory);

});

 

Injecting Values into Factory

A value can be injected into factory by the following method:

var firstModule = angular.module("firstModule", []);

firstModule.value("numberValue", 29);

firstModule.controller("FirstController", function($scope, numberValue) {

console.log(numberValue);

});

NOTE: It must be noted that the value produced by the factory function is injected, not the factory function itself.

With this, we come to an end of this Factory in AngularJS article. I hope you got an understanding of what exactly is a factory and how it differs from a service.

Check out the Angular training by Edureka, a trusted online learning company with a network of more than 250,000 satisfied learners spread across the globe. Angular is a JavaScript framework which is used to create scalable, enterprise, and performance client-side web applications. With Angular framework adoption being high, performance management of the application is community-driven indirectly driving better job opportunities. The Angular Certification Training aims at covering all these new concepts around Enterprise Application Development.

Comments
0 Comments

Browse Categories

webinar REGISTER FOR FREE WEBINAR
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP

Subscribe to our Newsletter, and get personalized recommendations.