在不同的控制器文件中使用服务

Question

服务 - optionService.js
控制器 - app.js和welcomeCtrl.js＆otherCtrl.js

app.js

var app = angular.module('mainapp', ['mainapp.welcome','optionServiceModule']);
app.controller('mainappCtrl', function ($scope,optionService) {
   optionService.fetchOptionDetails().success(function(response){
        $scope.option = response;
   });
});

welcomeCtrl.js

    var app = angular.module('mainapp.welcome', ['optionServiceModule']);

    app.controller('welcomeCtrl',[function($scope,optionService) {
        optionService.fetchOptionTwoDetails().success(function(response){
            $scope.OptionTwo = response;
        });
    }]);

optionService.js

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;
}]);

optionService在app.js中正常工作，但在WelcomeCtrl.js中给出了错误

错误

Cannot read property 'fetchOptionTwoDetails' of undefined

想知道如何在多个控制器文件中使用服务？

先感谢您

Answer 1

将$scope和optionService作为字符串注入控制器

app.controller('welcomeCtrl',['$scope','optionService',function($scope,optionService) {
        optionService.fetchOptionTwoDetails().success(function(response){
            $scope.OptionTwo = response;
        });
    }]);

Answer 2

查看此Jsfiddle链接

Js代码

  var app1 = angular.module('mainapp.welcome', ['optionServiceModule']);
  app1.controller('welcomeCtrl', function($scope, optionService) {
    optionService.fetchOptionTwoDetails().success(function(response) {
      $scope.OptionTwo = response;
    });
  });

你添加了[]但忘了添加dependecies