SetInterval dans AngularJS
Cet article présentera setInterval() dans AngularJS avec des exemples.
le setInterval() dans AngularJS
Lorsque vous travaillez sur une grande application productive dans Angular, nous devons définir des intervalles pour certaines tâches. Ces tâches s’occupent automatiquement de certaines données importantes après un certain intervalle.
Par exemple, si nous voulons effectuer une sauvegarde de toute la base de données, nous pouvons définir l’intervalle de temps sur 24 heures afin qu’elle soit sauvegardée toutes les 24 heures.
Si nous voulons afficher les dernières activités, publications ou notifications sur notre application, nous pouvons utiliser la méthode setInterval() dans l’application AngularJS. Cette méthode prend en compte deux paramètres.
Le premier paramètre est la fonction qui sera exécutée après chaque intervalle. Le deuxième paramètre est le temps en millisecondes.
La méthode setInterval() est une fonction qui spécifie l’intervalle en millisecondes. La méthode setInterval() continuera à s’exécuter lorsque l’application est en cours d’exécution.
Il n’y a que deux méthodes pour arrêter la méthode setInterval(). On peut fermer l’application ou utiliser une autre méthode, clearInterval(), pour terminer la méthode setInterval().
La syntaxe de la méthode setInterval() est présentée ci-dessous.
newInterval = setInterval(function(), milliseconds);
Si on veut stopper l’exécution, il faut utiliser la méthode clearinterval(). La syntaxe de cette méthode est présentée ci-dessous.
clearInterval(newInterval);
Passons en revue un exemple dans lequel nous obtiendrons l’heure actuelle et utiliserons la méthode setInterval() pour la mettre à jour toutes les secondes. Le code de cet exemple est illustré ci-dessous.
<!DOCTYPE html>
<html>
<body>
<p id="timer"></p>
<script>
setInterval(newTimer, 1000);
function newTimer() {
const newDate = new Date();
document.getElementById("timer").innerHTML = newDate.toLocaleTimeString();
}
</script>
</body>
</html>
Production:
L’exemple ci-dessus montre que l’heure est mise à jour toutes les secondes. Maintenant, si nous voulons ajouter une option pour arrêter le temps quand nous le voulons, nous pouvons utiliser la méthode clearInterval().
Reprenons le même exemple et ajoutons un bouton pour arrêter le temps ou la méthode setInterval() à l’aide de la méthode clearInterval(), comme indiqué ci-dessous.
<!DOCTYPE html>
<html>
<body>
<p id="timer"></p>
<button onclick="newStopFunc()">Stop Time By Clicking This Button</button>
<script>
const newInterval = setInterval(newTimer, 1000);
function newTimer() {
const newDate = new Date();
document.getElementById("timer").innerHTML = newDate.toLocaleTimeString();
}
function newStopFunc() {
clearInterval(newInterval);
}
</script>
</body>
</html>
Production:
Rana is a computer science graduate passionate about helping people to build and diagnose scalable web application problems and problems developers face across the full-stack.
LinkedIn