2

我是 AngularJS 的新手，所以这实际上可能指向一些我还没有完全理解的核心概念。我正在尝试使用$q&promise对象将“远程数据”视为本地数据。直到未获取远程数据时，promise对象才解析，但一旦解析，我希望视图中的所有相关数据绑定都得到更新。然而，下面的方法会导致一个无限循环，在这个循环中remote_total被重复调用，即使之前的调用remote_total导致了一个已解析的 promise 对象。

这是我的观点

<div ng-controller="MyController">
  {{ remote_total() }}
</div>

这是控制器的相关片段：

function MyController($scope, $q, $http) {
  $scope.remote_total = function() {
    var def = $q.defer();
    $http.get('/my/remote/service.json').success(function(data) {
      def.resolve(data);
    });
    return def.promise;
  }
}

首先，如果有人能向我解释为什么这会进入无限循环，那就太好了。其次，实现我想要做的事情的最佳方式是什么？

4

2 回答 2

5

注意：有关 Angular 1.2+，请参阅下面的更新

AngularJS 的承诺（提供）实际上很有趣$q，它们被 AngularJS 识别。还有一个是它们是可链接的！

所以在你的代码中你可以做

$scope.remote_total = $http.get('/my/remote/service.json').then(function(data) {
  return data;
});

并且只是查看<div>{{remote total}}</div>（注意：不是功能，只是价值）。

AngularJS 会自动识别它的 promise，解析 $http.get promise，然后链接到你的函数中，并将结果值放入模板中。

就这样 ：）

更新：默认情况下，AngularJS 1.2 中禁用了 Promise 的自动解包，并将在 1.3 中完全删除。

有效的代码：

$http.get('/my/remote/service.json').then(function(response) {
  $scope.remote_total = response.data;
});
于 2013-01-21T23:06:56.567 回答
3

Angular 进行脏检查以实现 2 路绑定。在每个周期中，它存储被监视属性的先前值并将其与新值进行比较。如果该属性是一个函数，则调用它并比较结果。

您确实放置了一个要监视的函数，并且在每个周期中，都会调用您的函数，从而导致 http 请求。

您想要做的是自己创建承诺并将该承诺附加到观看范围（或显示在视图中）。

此外， $http 服务已经返回了一个承诺，您不需要创建另一个承诺。

function MyController($scope, $q, $http) {
  $scope.getRemoteTotal = function() {
    var def = $http.get('/my/remote/service.json').then(function(response) {
      $scope.remoteTotal = response.data;
    });
  }
  $scope.getRemoteTotal();
}

.

<div ng-controller="MyController">
  {{ remoteTotal }}
</div>
于 2013-01-21T06:43:16.593 回答