web-dev-qa-db-fra.com

différence entre setTimeout en javascript et le service $ timeout en angularjs

Je suis nouveau sur angular Framework.Here est mon scénario où, je veux changer mon $ scope.variable après une période de temps, donc j'ai utilisé javascript setTimeout method.

$scope.variable = 'Previous';

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

Ce code ne fonctionne pas pour moi. J'ai utilisé $apply() pour faire fonctionner ce code.

Plus tard, j'ai appris que angular a lui-même un service $ timeout qui effectue le même travail.

$scope.variable = 'Previous';

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

Comment puis-je comparer les performances du service $timeout Avec javascript setTimeout ??

Pourquoi devrions-nous utiliser $timeout Au lieu de setTimeout ??

S'il vous plaît, donnez-moi des exemples et des raisons de l'utiliser, ce qui montre la performance.

Merci :)

javascriptangularjssettimeoutangular-services
26
Isetty Ravitejakumar

Dans certains cas, il est nécessaire d'effectuer une opération de temporisation. Nous y parvenons souvent à l'aide de la fonction setTimeout() de JavaScript.

Cependant, si nous utilisons setTimeout() dans une application AngularJS, nous devons également utiliser $scope.$apply() pour nous assurer que toute modification apportée à la scope sera reflétée ailleurs (c'est-à-dire liée aux données). dans un view).

AngularJS fournit un wrapper pratique pour ceci: $timeout() - il fait le $apply() pour lequel nous n'avons pas à $apply les changements.

Concernant le performance.

Si vous utilisez $timeout pour créer ce qui est essentiellement un intervalle, alors ne l'utilisez pas. Si votre application est volumineuse, alors $apply déclenchera également un $digest cycle que vous ne voulez peut-être pas vraiment, cela va sûrement diminuer les performances.

27
Nikhilesh Shivarathri

Toute variable de portée AngularJS lorsqu'elle est gérée de l'extérieur (y compris ajax) nécessite un $ apply ().

$ timeout () prend en charge l'étendue actuelle et s'exécute dans le même cycle de digest après la détection de toutes les modifications.

Une des beautés de $ timeout () que j’ai récemment découverte est que si vous ne passez pas le paramètre time, il attendra l’achèvement du DOM.

Alors,

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

Exécutez ce code dans une directive et la fonction de rappel de délai d'attente sera déclenchée une fois que le partiel aura été chargé par la directive.

J'espère que cela t'aides.

19
Tarun