Angularjs $resource 和 $http 同步调用？答案

【问题标题】：Angularjs $resource and $http synchronous call?Angularjs $resource 和 $http 同步调用？
【发布时间】：2014-04-08 20:17:20
【问题描述】：

我想编写两个服务，一个使用$http.get 方法，一个使用$resource

这个服务应该接收一个 Json 对象，看起来像这样，目前这段代码直接在我的控制器中，而不是在服务中：

 var csvPromise= $http.get(base_url + 'DataSource/1').success(function(data) {
     $scope.data4=JSON.stringify(data);
 });

问题是，我想将接收到的数据保存在$scope.data4 中，并且我想在$http.get 调用之后使用这些数据，但该值为空。

在这个调用之后直接有需要这个值的对象：

new myObject($scope.data4)

所以myObject 必须等待很长时间，直到数据到达。

或者我可以使用$http 或$resource 进行同步调用吗？

我该怎么做？我找到了很多 promise 和 .then 的例子，但对我没有任何帮助。

编辑：我现在写了一个服务，但它没有工作：

 var test=angular.module('myApp.getCSV', ['ngResource']);
 test.factory('getCSV',function($log, $http,$q, $resource){
     return {
         getData: function (id) {
             var csvPromise= $http.get(base_url +'DataSource/'+id)
                 .success(function(data) {
                 return data;
             });
                 return csvPromise;
         }
     }
 });

然后在我的控制器中我称之为：

 getCSV.getData(1).then(function(theData){
         $scope.data4=JSON.stringify(theData);
         new myObject( $scope.data4); });

但这不起作用。我想如果$http.get 接收到数据，那么then 函数就会被调用。

【问题讨论】：

success 和 error 方法是 $http 特定的，不构成承诺链的一部分。将您的服务 getData() 函数体更改为：return $http.get(base_url +'DataSource/'+id); 这将返回承诺，一旦解决，将在控制器内调用您的 then 函数。另请参阅下面我的答案以获取替代选项。

标签： json angularjs http rest asynchronous

【解决方案1】：

我不相信您可以进行同步调用。也就是说，您至少有两种选择：

1) 使用 $routeProvider resolve 功能传入数据。来自文档：

An optional map of dependencies which should be injected into the controller. If any of these dependencies are promises, the router will wait for them all to be resolved or one to be rejected before the controller is instantiated. If all the promises are resolved successfully, the values of the resolved promises are injected

一个关于如何使用它的例子：

$routeProvider
  .when('/your/path', {
    templateUrl: '/app/yourtemplate.html',
    controller: 'yourController',
    resolve: {
      data: ['$route', '$http', function($route, $http) {
        return $http.get(base_url +'DataSource/1');
      }]
    }
  })

然后在你的控制器中：

app.controller('yourController', ['$scope', 'data', function($scope, data) {
  $scope.data4 = JSON.stringufy(data);
  var yourObj = new myObject($scope.data4);
}]);

2) 第二种选择是使用 Promise，并且仅在 Promise 成功完成后实例化您的 new myObject($scope.data4)。

【讨论】：

【解决方案2】：

您的代码需要稍作改动：

$scope.data4 = '';

var csvPromise= $http.get(base_url +'DataSource/1');
csvPromise.then(function(data){
    $scope.data4 = JSON.stringify(data);
}, function(data){
    //error handling should go here
    window.alert(data);
});

这应该可以满足您的需要。

【讨论】：

你能提供一些细节吗？哪里失败了？抛出了什么错误？

【解决方案3】：

据我所知，sync~ 无法拨打http 或resource。它们被硬编码在 AngularJS 核心文件中：

xhr.open(method, url, true);

您也不想通过阻止浏览器等待数据到达来伤害您的用户。您最好展示一下您是如何制作的

您是否尝试在success 方法中调用new myObject($scope.data4)？

$http.get(...).success(function(data){
    $scope.data4 = JSON.stringify(data); // I've no idea why do you need this.

    var stuff = new myObject($scope.data4); // THis is now your.
});

【讨论】：