在 http 服务 returns 之后，范围变量未获取数据对象

Question

我正在尝试读取服务器上的文件列表。 HTTP GET 方法服务 returns 文件列表，但控制器中的范围变量未使用 return 值更新。你能帮我找出问题所在吗？

app.controller('RdaController', ['$scope', ', 'RdaService', function($scope, RdaService) {
  $scope.listOfFilesOnCTP = "";
 
 $scope.GetListOfFilesonCTP = function(path){
  $scope.$apply(function(){
   $scope.listOfFilesOnCTP = RdaService.getListOfFilesonCTP(encodeURIComponent(path)); 
  });
  //path = path.replace(/\//g, '_');
  console.log($scope.listOfFilesOnCTP);  //--> This scope variable does not get updated.
  return $scope.listOfFilesOnCTP;
 }
}]);

app.service('RdaService', ['$http', function($http) { 
  this.getListOfFilesonCTP = function(path){   
   return $http ({
   method: "GET",
  url: "../api/CTP/getFilesonCTP/"+ path,
  headers: { 'Content-Type': 'application/json' }
  }).success(function(data){
  return data;    //---> contains the expected value
  }).error(function(data){
   return data;
  });
};
}]);

 <div class="col-md-3" id="CTP Jobs">
  <h3>JOBS</h3>
  <table class="table table-striped"
   ng-init="GetListOfFilesonCTP('/home/topas/rda_app/JOBS')"
   ng-model="listOfFilesOnCTP">   <!-- This variable is not updated-->
   <div ng-repeat="file in listOfFilesOnCTP">
    <span><tr>{{file}}
     </tr></span>
   </div>
  </table>
 </div>

Answer 1

您的代码中有几处错误。

return 只承诺 return 通过 $http.get 方法从服务中编辑。因为当您尝试 return 来自 $http 方法的 .success 和 .error 回调的数据时。它不会 return 返回数据。
在服务方法调用上使用 .then 函数，成功时将使用由 $http 编辑的数据 return 调用第一个函数。
您期望 console.log($scope.listOfFilesOnCTP); 打印由服务 return 编辑的数据。不过这不会return吧。异步调用不能以这种方式工作。他们将return以特殊方式输出数据，如承诺解析或回调方式。
这里不需要使用$scope.$apply，因为$http服务已经处理了摘要周期。
尽量减少 ng-init 的使用，您可以在控制器初始化时调用该方法。

服务

app.service('RdaService', ['$http', function($http) { 
  var self = this;
  self.getListOfFilesonCTP = function(path) {     
      return $http ({
      method: "GET",
        url: "../api/CTP/getFilesonCTP/"+ path,
        headers: { 'Content-Type': 'application/json' }
    });
  };
}]);

然后在控制器中检索数据时使用该承诺。

app.controller('RdaController', ['$scope', 'RdaService', function($scope, RdaService) {
    $scope.listOfFilesOnCTP = "";

    $scope.GetListOfFilesonCTP = function(path) {
        $scope.listOfFilesOnCTP = RdaService.getListOfFilesonCTP(encodeURIComponent(path)).then(function() {
            console.log($scope.listOfFilesOnCTP);
        });
    };
}]);

在 http 服务 returns 之后，范围变量未获取数据对象

Scope variable not getting data object after http service returns

angularjs

angularjs-scope

angularjs-apply