web-dev-qa-db-ja.com

javascriptのsetTimeoutとangularjsの$ timeoutサービスの違い

私はangularフレームワークに新しい。ここで私のシナリオは、私はjavascript setTimeoutメソッドを使用して、一定期間後に$ scope.variableを変更したいです。

_$scope.variable = 'Previous';

setTimeout(function(){
  $scope.variable='NEXT';
},3000);
_

このコードは私には機能しません。このコードを機能させるために$apply()を使用しました。

後で私はangular自体が同じ仕事をする$ timeoutサービスを持っていることを知りました。

_$scope.variable = 'Previous';

$timeout(function () {
  $scope.variable = 'NEXT';
}, 2000);
_

_$timeout_サービスのパフォーマンスとjavascript setTimeoutを比較するにはどうすればよいですか?

setTimeoutの代わりに_$timeout_を使用する必要があるのはなぜですか?

パフォーマンスを示すいくつかの例と使用理由を教えてください。

ありがとう:)

26

ある種のタイムアウト操作を実行する必要がある場合がありますが、JavaScriptのsetTimeout()関数を使用してこれを頻繁に達成します。

ただし、AngularJSアプリケーションでsetTimeout()を使用する場合は、$scope.$apply()を使用してscopeへの変更が他の場所に反映されるようにする必要があります(データバインドview)。

AngularJSは、このための便利なラッパーを提供します。$timeout()-変更を_$apply_する必要のない$apply()を実行します。

パフォーマンスについて。

_$timeout_を使用して本質的に間隔であるものを作成している場合は、使用しないでください。アプリケーションが大きい場合は、_$apply_も_$digest_サイクルをトリガーしますが、これは実際には発生させたくない場合があり、パフォーマンスが確実に低下します。

27

外部(Ajaxを含む)から処理する場合、AngularJSスコープ変数には$ apply()が必要です。

$ timeout()は現在のスコープを処理し、すべての変更検出が行われた後、同じダイジェストサイクルで実行されます。

私が最近発見した$ timeout()の美しさの1つは、timeパラメーターを渡さない場合、DOMの完了を待つことです。

そう、

$timeout(function(){
  console.log("show after directive partial loaded")
}); //note, no time parameter

ディレクティブでこのコードを実行すると、ディレクティブによってパーシャルがロードされるとタイムアウトコールバック関数が起動します

お役に立てれば。

19
Tarun