javascript - 在不同的 Controller 文件中使用服务

Question

服务-optionService.js
Controller - 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

想知道如何在多个 Controller 文件中使用服务吗？

提前致谢

Answer 1

将 $scope 和 optionService 作为字符串注入(inject) Controller

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