angularjs - setTimeout 関数を使用して配列に項目を追加できません

Question

新しいエントリを配列にプッシュして ui を更新しようとしていますが、何らかの理由で、配列に対する次の操作まで ui が更新されません。

function TestCtrl($scope){
  $scope.projects = [{name: "project1"}];

  $scope.test = function(){ return "batman"; };

  $scope.addNew = function(){
    $scope.projects.push({name: "project2"});
    setTimeout(function(){
      $scope.projects.push({name: "project3"});
    }, 1000);
  };
}

そして、ここに例がありますhttp://jsbin.com/itasis/4/edit

まだテストしていませんが、ajax リクエストからの動作で同じ問題が発生することが予想されます。

Answer 1

の代わりに$timeoutを使用しsetTimeoutます。 $timeout自動的に私たちを呼び出し、 Angular ダイジェスト サイクル$apply()をトリガーし、更新が必要なビューを更新します。

AJAX に関しては、Angular の$httpサービスを使用することをお勧めします。これも私たちを呼び出します$apply()。それ以外の場合は、AJAX コールバックで、Angular モデル/スコープを更新した後、手動で を呼び出しますscope.$apply()。