AngularJS HTTP GET範圍

Question

我是新來的AngularJS和我試圖修改此代碼以包裹約定在我的頭：

https://github.com/flatlogic/angular-material-dashboard/blob/master/src/app/components/services/MessagesService.js

我修改它使用REST服務取消消息而不是使用消息數組。

這裏的MessageService代碼：

(function(){ 
    'use strict'; 

    angular.module('app') 
     .service('messagesService', [ 
     '$scope', '$http', 
     messagesService 
    ]); 

    function messagesService($scope,$http){ 
    return { 
     loadAllItems : function() { 
     //return $q.when(messages); 
     return $http({ 
      method: 'GET', 
      url: 'http://localhost:3000/messages', 
     }) 
       .then(function(data) { 
        console.log(data); 
        return data; 
       }) 
     } 
    }; 
    } 


})(); 

但我發現了有關範圍的錯誤：

Error: [$injector:unpr] Unknown provider: $scopeProvider <- $scope <- messagesService 

Answer 1

正如Matthew Cawley所說，服務不能訪問範圍。你也不能按照你的方式從loadAllItems()返回數據。

這可能是你想要與控制器例如什麼：

(function() { 
    'use strict'; 

    var app = angular.module('app'); 

    app.service('messagesService', ['$http', messagesService]); 

    function messagesService($http) { 
    return { 
     loadAllItems: function() { 
     //This will make the get request and return the promise that $http sends back. 
     return $http({ 
      method: 'GET', 
      url: 'http://localhost:3000/messages', 
     }); 
     } 
    }; 
    }; 

    app.controller('testCtrl', ['$scope', "messagesService", function($scope, messagesService) { 
    //Onload 
    messagesService.loadAllItems().then(function(data) { 
     console.log(data); //Your data from the messageService 
    }, function(err) { 
     console.log(err); //Error from the messageService 
    }); 
    }]); 


}()); 

$http返回一個可以在你的控制器訪問一個承諾。然後，您可以在範圍內設置變量，並使數據可以被視圖訪問。

例：

$scope.items = data;內testCtrl。

Answer 2

採取所有引用到$scope了，你不能注入到範圍一項服務。