如何在Angular中添加服務以便控制器可以使用它？

Question

我有一個基本的角度設置。我想添加另一個工廠服務，以便mainCtrl可以使用它。

這裏是我的controller.js

angular.module('Manalator.controllers', []) 
    .controller('MainCtrl', ['$scope', function ($scope, manaFactory) { 
     manaFactory.testString(); 
    }]); 

這裏是我的services.js

angular.module('Manalator.services', []) 
    .factory('cordovaReady', [function() { 
     return function (fn) { 
      var queue = [], 
       impl = function() { 
        queue.push([].slice.call(arguments)); 
       }; 

      document.addEventListener('deviceready', function() { 
       queue.forEach(function (args) { 
        fn.apply(this, args); 
       }); 
       impl = fn; 
      }, false); 

      return function() { 
       return impl.apply(this, arguments); 
      }; 
     }; 
    }]) 
    .factory('manaFactory', [function(){ 
     this.testString = function(){ 
      return 'This works'; 
     }; 
    }]); 

這裏是我的routes.js

angular.module('Manalator', ['ngRoute', 'Manalator.services', 'Manalator.controllers']) 
    .config(function ($routeProvider) { 
     $routeProvider 
      .when('/', { 
       controller: 'MainCtrl', 
       templateUrl: 'partials/pages/main.html' 
      }) 
      .when('/devotion', { 
       controller: 'MainCtrl', 
       templateUrl: 'partials/pages/devotion.html' 
      }) 
      .when('/results', { 
       controller: 'MainCtrl', 
       templateUrl: 'partials/pages/results.html' 
      }) 
      .otherwise({redirectTo: '/'}); 
    }); 

我得到的以下錯誤：

TypeError: Cannot read property 'testy' of undefined 
    at new <anonymous> (controllers.js:3) 
    at Object.i [as invoke] (main.min.js:1) 
    at $get.f.instance (main.min.js:2) 
    at m (main.min.js:1) 
    at s (main.min.js:1) 
    at $get.e (main.min.js:1) 
    at main.min.js:1 
    at p.$get.p.$eval (main.min.js:3) 
    at p.$get.p.$apply (main.min.js:3) 
    at main.min.js:1 

這是一個具有基本路線的科爾多瓦phonegap設置。我對角度很陌生。我已經瀏覽了互聯網，並且即時通過設置基本服務來保存我的所有數據，所以我可以從我的所有路線訪問它。任何幫助，將不勝感激。

Answer 1

您需要將您的服務標識爲控制器的依賴項。

第一步是確保您在控制器之前定義服務。

然後更改控制器代碼，以便它將服務命名爲依賴項。

angular.module('Manalator.controllers', ['Manalator.services']) 
.controller('MainCtrl', ['$scope', function ($scope, manaFactory) { 
    manaFactory.testString(); 
}]); 

希望這有助於！