Question

给出以下AngularJS控制器：

function PhoneListCtrl($scope, $http) {
  $scope.phones = {};    

  $http.get('phones/phones.json').success(function(data) {
      $scope.phones = data.splice(0, 5);
  });

  $scope.orderProp = 'age';
}

使用该代码（来自角度官方教程），将更新绑定phones模型的模板以反映收到的JSON响应。但是，如果将$ scope更新包装在setTimeout语句中，如下所示：

function PhoneListCtrl($scope, $http) {
  $scope.phones = {};    

  $http.get('phones/phones.json').success(function(data) {
    setTimeout(
        function(){
            $scope.phones = data.splice(0, 5);
        }, 
        5000
    );
  });

  $scope.orderProp = 'age';
}

模板不会更新，在这种情况下，角度代码似乎不会取代模型更改。

我的问题很明显：为什么在第二种情况下不起作用？如何在$ http回调中通知角度运行时模型更改？

Answer 1

当你使用setTimeout时，你会在角度框架之外执行回调函数（即使它没有延迟）。如果你想在这个函数中改变Angular，你必须使用$scope.$apply通知Angular - 就像这样：

setTimeout(
  function(){
    $scope.$apply(function(){
      $scope.phones = data.splice(0, 5);
    }
   },5000);

如果你必须使用setTimeout，你应该看一下$timout service。

$ http服务的回调方法如何通知模型更改的角度？

1 个答案: