javascript - angularjs中http请求的无限循环

Question

我看到了与此相关的其他问题，但没有帮助我。

我在 angularjs Controller 中有函数:

$scope.getUser = function(id){
    ret = null;
    $http.get('services/rest/users/' + id).then(
        function(response){
            ret = response.data.name;
        }, 
        function(response){
        }
    )
        return ret;
} 

我在 html 中调用该函数:

<div ng-repeat = "move in moves">Player:<span> {{getUser(move.player_id)}} </span> - {{move.guess}} - {{move.answer}}</div>

这会创建 'services/rest/users/' + id 请求的无限循环。我看到当范围内的某些对象总是变化时， Angular 可以做到这一点，但我在这里没有看到这一点。

Answer 1

方法都是错误的。

$http 是异步的，从 getUser() 返回时 ret 始终为 null

切勿在 View 中使用直接发出异步请求的函数。

相反，在 Controller 中(或者更好的是在服务中)迭代所有 moves ，请求玩家数据，并将其添加为每个 moves 的属性

function getUser(id) {
  return $http.get('services/rest/users/' + id).then(function(response) {
    return response.data.name;
  }).catch(function() {
    return 'Unknown Player';
  })
}


angular.forEach($scope.moves, function(move){
   getUser(move.player_id).then(function(player){
      move.player = player;
   });
});

查看:

<div ng-repeat = "move in moves">Player:<span> {{move.player)}} </span>...</div>