Maison > interface Web > js tutoriel > le corps du texte

Comment implémenter l'effet de minuterie dans Angular

php中世界最好的语言
Libérer: 2018-04-13 13:34:40
original
2643 Les gens l'ont consulté

Cette fois, je vais vous montrer comment implémenter l'effet timer dans Angular Quelles sont les précautions pour Angular pour implémenter l'effet timer. cas. Jetons un coup d'oeil une fois.

Cet article présente un exemple de fonction de minuterie simple implémentée par Angular et le partage avec des amis dans le besoin.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title> Angular定时器</title>
  <script src="angular.min.js"></script>
  <script>
    var myapp=angular.module("myapp",[]);
    myapp.controller("myCtrl",function ($scope,$interval,$timeout) {
      $scope.num=0;
      $scope.fun=function () {
//        $interval(function () {
//          $scope.num++
//        },1000)
//        setInterval(function () {
//          $scope.$apply(function () {
//            $scope.num++;
//            console.log($scope.num)
//          })
//        },1000);
//                $interval(function () {
//
//            $scope.num++;
//            console.log($scope.num);
//
//        },1000,5,false);
        $timeout(function () {
          $scope.num++;
        },1000);
      }
    })
  </script>
</head>
<body ng-app="myapp" ng-controller="myCtrl">
<p>{{num}}</p>
<button ng-click="fun()">按钮</button>
</body>
</html>
Copier après la connexion

Exécutez le code et cliquez sur le bouton pour voir le numéro Programmation1 au-dessus du bouton après 1 seconde. Implémentation d'une fonction de déclenchement de synchronisation simple.

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Comment Vue exécute la méthode publique de requête ajax

Explication détaillée de l'utilisation des instructions personnalisées dans Angular17

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal