AngularJs服务-$timeout or $interval(定时器)

傷城~ 2022-07-12 07:07 171阅读 0赞

<!DOCTYPE html>  
    <html lang="en" ng-app="App">  
    <head>  
        <meta charset="UTF-8">  
        <title>$timeout&$interval 服务</title>  
    </head>  
      
    <body>  
        <div ng-controller="DemoController">  
            <ul>  
                <li>{
       {msg}}</li>  
                <li>{
       {now|date: 'yyyy-MM-dd hh:mm:ss'}}</li>  
                <li><button ng-click="stop()">停</button></li>  
            </ul>  
        </div>  
        <script src="../libs/angular.min.js"></script>  
        <script>  
            var App = angular.module('App', []);  
      
            App.controller('DemoController', ['$scope', '$timeout', '$interval',function ($scope, $timeout, $interval) {  
      
                $timeout(function () {  
                    $scope.msg = '执行了';  
                }, 3000);  
      
                var timer = $interval(function () {  
                    $scope.now = new Date;  
                }, 1000);  
      
                $scope.stop = function () {  
                    $interval.cancel(timer);  
                }  
      
            }]);  
      
        </script>  
      
    </body>  
    </html>

发表评论取消回复

表情：

评论列表（有 0 条评论，171人围观）

还没有评论，来说两句吧...

相关阅读

相关 AngularJS中的定时器，以及定时器的移除clear

.相比较于JS中setTimeInterval和setTimeout，angularJS中通过interval来实现定时器的效果，通过interval来实现定时器的效果，...

雨点打透心脏的1/2处/ 2024年04月18日 18:37/ 0 赞/ 59 阅读

相关 php计时器停止,AngularJS停止定时器

1、问题背景设置一个定时器，给定两个变量startData和endData，计时开始后分别减去5和50；单击停止暂停定时器，重置后数据恢复到原来的数据。 2、实现源码

痛定思痛。/ 2023年01月17日 15:51/ 0 赞/ 157 阅读

相关 AngularJS之定时器（timeout）

1、问题背景 AngularJS某一时间段后，出现另一种情况，这里需要用到定时器timeout 2、实现源码 <!DOCTYPE html>

旧城等待，/ 2022年07月16日 23:10/ 0 赞/ 173 阅读

相关 angularjs服务

<!DOCTYPE html> <html ng-app="app"> <head> <title>dd</title> <scri

- 日理万妓/ 2022年07月15日 01:59/ 0 赞/ 192 阅读

相关 AngularJS 定时器(获取当前日期)

<!DOCTYPE html> <html lang="en" ng-app="App"> <head> <meta charset="UTF

ゝ一纸荒年。/ 2022年07月12日 08:14/ 0 赞/ 201 阅读

相关 AngularJS 定时器(获取当前日期)

<!DOCTYPE html> <html lang="en" ng-app="App"> <head> <meta charset="UTF

╰半夏微凉°/ 2022年07月12日 08:14/ 0 赞/ 181 阅读

相关 AngularJs服务-$timeout or $interval(定时器)

<!DOCTYPE html> <html lang="en" ng-app="App"> <head> <meta cha

傷城~/ 2022年07月12日 07:07/ 0 赞/ 172 阅读

相关 angularjs周期性定时器

var app = angular.module("app"); app.controller("appController", function (

Bertha 。/ 2022年05月28日 01:54/ 0 赞/ 217 阅读

相关 Angularjs 服务

AngularJS 服务(Service)：www.runoob.com/angularjs/angularjs-services.html AngularJS 内建了30

「爱情、让人受尽委屈。」/ 2022年05月21日 04:50/ 0 赞/ 258 阅读

相关 AngularJs 定时器/时间轴服务

时间轴服务 1、NG中也能写js语法,因为输入js范围 2、使用时需要在控制器脚本中注入 3、注入服务参数可以有多个

心已赠人/ 2021年07月24日 22:54/ 0 赞/ 423 阅读