為什么在Angular服務中未定義$ http.get（）？

Question

我正在嘗試加載一些JSON並使用$ rootScope進行存儲，以使其在控制器之間持久存在。 當我運行我的應用程序時，出現以下錯誤：

TypeError: Cannot call method 'get' of undefined

在我嘗試引入$ rootScope之前，get方法一直運行良好...有什么想法嗎？

我的服務如下所示：

  1 /**
  2  * Service to get the quiz data from a JSON source
  3  */
  4 app.factory('quizService', ['$rootScope', function ($scope, $rootScope, $http) {
  5     var promise;
  6     var service = {
  7         getQuiz: function($scope, $http) {
  8             if ( !promise ) {
  9                 promise = $http.get('QuizFileName.quiz').then(function (response) {
 10                     return response.data;
 11                 });
 12             }
 13             return promise;
 14         }
 15     };
 16     return service;
 17 }]);

我的控制器如下所示：

  7     // Get Quiz data from service
  8     quizService.getQuiz().then(function(data) {
  9         $scope.quiz = data;
 10
 11         // Redirect to scores if already completed this
 12         if($scope.quiz.complete === true) {
 13             $location.path('scores');
 14         }
 15     });

Answer 1

您在定義工廠時使用了“陣列模式”。 您應該在函數中使用的每個服務都有一個字符串，但是只有一個。

也就是說，你要做的是

app.factory('quizService', ['$rootScope', function ($scope, $rootScope, $http) {
    //insert code
}]);

但是你應該做的是

app.factory('quizService', ['$scope', '$rootScope', '$http', function ($scope, $rootScope, $http) {
    //insert code
}]);

AngularJS將使用字符串命名的函數映射到參數。 試試看，看看是否能解決您的問題。

編輯 ：啊，Reboog711的答案在解決該問題上更有意義，我不知何故錯過了代碼的后半部分。 但是我留下這個答案，因為您還應該修復工廠定義。

Answer 2

getQuiz是工廠內部的函數：

getQuiz: function($scope, $http) {

調用getQuiz時，不會在其中傳遞任何參數：

quizService.getQuiz()

$ http是未定義的，因為您在調用它時未傳遞任何參數。 Angular不會將項目注入到您手動調用的函數中。 它將僅使用AngularJS調用的函數（例如控制器或工廠函數）來執行此操作。

因此，您有一些選擇。 一種是將$ scope和$ http參數傳遞給函數，如下所示：

quizService.getQuiz($scope, $http)

我敢肯定，這將解決問題，但這肯定是一種怪異的方法。

我可能會從函數定義中刪除$ scope和$ http函數：

 getQuiz: function() {

然后確保您修改了出廠定義：

app.factory('quizService', ['$scope','$rootScope','$http', function ($scope, $rootScope, $http) {

沒有此修改，Angular服務將不會傳遞到您的函數中。

然后，當您在函數內部訪問$ http時，它應訪問傳遞給工廠的值，該值不應是未定義的。

Answer 3

好的，Reboog711使我走上了正確的軌道，我需要修改我的工廠定義以包含$ http，我以前曾嘗試這樣做，但錯誤地將其像這樣放在一起：

'$rootScope, $http'

不要這樣做，這是好事，也是錯誤的！ 但是Reboog711的回答也給了我錯誤，因為我認為您不能以我們都認為的方式使用$ scope。

正確的（或有效的）解決方案是：

app.factory('quizService', ['$rootScope', '$http', function ($rootScope, $http) {

我希望這可以幫助Angular的其他新手。 非常感謝所有回答評論的人。 我非常尊重這個社區對幫助他人的態度：)