<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8" />
  <title>AngularJs Dependency Injection</title>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.6/angular.min.js"></script>
  <script>
    var app = angular.module('appDI', []);

    //factory method
    app.factory('diFactory', function() {
      return {
        user: {
          name: 'Anil Singh'
        },
      };
    });

    //provider method
    app.provider('diProvider', function() {
      this.$get = function(diFactory) {
        return {
          diFactory: diFactory
        };
      };
    });

    //controller method
    app.controller('diCtrl', ['$scope', 'diProvider', function($scope, diProvider) {
      $scope.name = diProvider.diFactory.user.name;
    }]);
  </script>
</head>

<body ng-app="appDI" ng-controller="diCtrl">
  <div>
    <div>
      <h1> Example for AngularJs Dependency Injection</h1>
    </div>
    <div>Result is = {{name}}
      <br> </div>

    <div> <br><br><br><a href="http://www.code-sample.com/2015/09/angularjs-dependency-injection-example.html" target="_blank">click Know in detail</a></div>
  </div>
</body>

</html>
/* Put your css in here */