title: using service in different controllers files
body: <p>Service - optionService.js<br>
  controllers - app.js &amp; welcomeCtrl.js &amp; otherCtrl.js</p>
  
  <p><strong>app.js</strong></p>
  
  <pre><code>var app = angular.module('mainapp', ['mainapp.welcome','optionServiceModule']);
  app.controller('mainappCtrl', function ($scope,optionService) {
     optionService.fetchOptionDetails().success(function(response){
          $scope.option = response;
     });
  });
  </code></pre>
  
  <p><strong>welcomeCtrl.js</strong></p>
  
  <pre><code>    var app = angular.module('mainapp.welcome', ['optionServiceModule']);
  
      app.controller('welcomeCtrl',[function($scope,optionService) {
          optionService.fetchOptionTwoDetails().success(function(response){
              $scope.OptionTwo = response;
          });
      }]);
  </code></pre>
  
  <p><strong>optionService.js</strong></p>
  
  <pre><code>var app = angular.module('optionServiceModule',[]);
  
  app.factory('optionService',['$http',function($http) {
    var obj = {};
  
      obj.fetchOptionDetails = function(){ 
          return $http.get('localhost/api/option/optionOne');
      }
  
      obj.fetchOptionTwoDetails = function(){
          return $http.get('localhost/api/option/optionTwo');
      }
   return obj;
  }]);
  </code></pre>
  
  <p>optionService is working fine in app.js but 
  giving error in WelcomeCtrl.js</p>
  
  <p><strong>Error</strong></p>
  
  <pre><code>Cannot read property 'fetchOptionTwoDetails' of undefined
  </code></pre>
  
  <p>wanna know how to use a service in multiple controller file ?</p>
  
  <p>Thank you In Advance</p>