Flat 10% & upto 50% off + Free additional Courses. Hurry up!

AngularJS Dependency Injection


It is a software design pattern in which components are given their dependencies that means it deals with how components get hold of their dependencies. It makes components reusable.  It provides some components that can be injected into each other as dependencies which are as follows:

  • factory
  • value
  • constant
  • service
  • provider


1. factory – It is a function which returns value. It produces value on demand when a service or controller needed.

2. value – It is a javascript object It passes values to controller config phase.

3. constant – constants passes values at config phase considering the fact that value cannot be used to be passed during config phase.

5. service – It is a singleton javascript object which have a set of functions to execute certain tasks. It is defined by service() function.

6. provider – It is used to create factory, service etc. in config phase.




<title> Dependency Injection in AngularJS</title>



<h1>Example of Dependency Injection</h1>

<div ng-app = "intellipaatApp" ng-controller = "CalcController">

<p>Enter a number: <input type = "number" ng-model = "number" /></p>

<button ng-click = "cube()">X<sup>3</sup></button>

<p>Result: {{result}}</p>


<script src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>


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

//create a service using provider which describes a method cube to return cube of a number.

intellipaatApp.config(function($provide) {

$provide.provider('MultiplyService', function() {

this.$get = function() {

var factory = {};

factory.multiply = function(a, b, c) {

return a * b * c;


return factory;




// make a value object as "defaultInput" and pass it a data

intellipaatApp.value("defaultInput", 2);

/*make a factory "MultiplyService" which gives a method multiply to return multiplication of three numbers  */

intellipaatApp.factory('MultiplyService', function() {

var factory = {};

factory.multiply = function(a, b, c) {

return a * b * c;


return factory;


/* inject the factory "MultiplyService" in a service to use the multiply method of factory and make a service which defines a method cube to return cube of a number*/

intellipaatApp.service('CalcService', function(MultiplyService){

this.cube= function(a) {

return MultiplyService.multiply(a,a,a);



/* insert the value using its name "defaultInput" and

insert the service "CalcService" into the controller */

intellipaatApp.controller('CalcController', function($scope, CalcService, defaultInput) {

$scope.number = defaultInput;

$scope.result = CalcService.cube($scope.number);

$scope.cube= function() {

$scope.result = CalcService.cube($scope.number);








"0 Responses on AngularJS Dependency Injection"

Training in Cities

Bangalore, Hyderabad, Chennai, Delhi, Kolkata, UK, London, Chicago, San Francisco, Dallas, Washington, New York, Orlando, Boston

100% Secure Payments. All major credit & debit cards accepted Or Pay by Paypal.


Sales Offer

  • To avail this offer, enroll before 27th October 2016.
  • This offer cannot be combined with any other offer.
  • This offer is valid on selected courses only.
  • Please use coupon codes mentioned below to avail the offer
DW offer

Sign Up or Login to view the Free AngularJS Dependency Injection.