数据被覆盖或损坏。是什么原因？

Question

这是我的控制器和服务代码。我正在使用 AngularJS v1.6

app.controller('ServicesCtrl',['$scope','$http','DataService',function($scope,$http,DataService){

 $scope.returnedData = DataService.GetData('services1.json'); 
}]);

app.controller('ContactCtrl',['$scope','$http','DataService',function($scope,$http,DataService){

 $scope.returnedData = DataService.GetData('location.json'); 
// console.log($scope.returnedData);
}]);

app.service('DataService', ['$http', function($http){
 var data;
 this.GetData = function(path) {
   $http.get(path).then(function(response){
    //console.log(response.data);
   data = response.data;
  });
  return data;
 };
}]);

为什么我的数据在 return 上损坏到控制器功能。我得到一个意想不到的属性 of $$hashkey 和对象的值 (12)。我是初学者，请用通俗易懂的语言解释一下。我能够在 DataService 中注销正确的数据，但它在控制器内部被破坏了。两个控制器的数据只是混合在视图中。即使我不使用其中一个控制器，另一个也无法正常工作。

Answer 1

您需要像下面这样调用：Promise 将解析并在您的控制器中提供数据。结帐工作 plunker

app.controller('ServicesCtrl', ['$scope', '$http', 'DataService', function($scope, $http, DataService) {

      DataService.GetData('services1.json').then(function(response) {
        $scope.returnedData = response.data;
      });
    }]);

    app.controller('ContactCtrl', ['$scope', '$http', 'DataService', function($scope, $http, DataService) {

      DataService.GetData('location.json').then(function(response) {
        $scope.returnedData = response.data;
      });
    }]);

    app.service('DataService', ['$http', function($http) {
      var data;
      this.GetData = function(path) {
        return $http.get(path)
      };
    }]);

数据被覆盖或损坏。是什么原因？

Data getting overwritten or corrupted. What is the reason?

angularjs

angularjs-scope

angular-services