大佬教程收集整理的这篇文章主要介绍了angularjs-$interval,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
http://www.webfront-js.com/articaldetail/86.html
<!doctype html> <html lang="en"> <head> <Meta charset="UTF-8"> <title>Example - example-interval-service-production</title> <script src="//code.angularjs.org/snapshot/angular.min.js"></script> </head> <body ng-app="intervalExample"> <script> angular.module('intervalExample',[]) .controller('ExampleController',['$scope','$interval',function($scope,$interval) { $scope.format = 'M/d/yy h:mm:ss a'; $scope.blood_1 = 100; $scope.blood_2 = 120; var stop; $scope.fight = function() { // Don't start a new fight if we are already fighTing if ( angular.isDefined(stop) ) return; stop = $interval(function() { if ($scope.blood_1 > 0 && $scope.blood_2 > 0) { $scope.blood_1 = $scope.blood_1 - 3; $scope.blood_2 = $scope.blood_2 - 4; } else { $scope.stopfight(); } },100); }; $scope.stopfight = function() { if (angular.isDefined(stop)) { $interval.cancel(stop); stop = undefined; } }; $scope.resetfight = function() { $scope.blood_1 = 100; $scope.blood_2 = 120; }; $scope.$on('$destroy',function() { // Make sure that thE interval is destroyed too $scope.stopfight(); }); }]) // Register the 'myCurrentTime' directive factory method. // We inject $interval and dateFilter service since the factory method is DI. .directive('myCurrentTime',['$interval','dateFilter',function($interval,dateFilter) { // return the directive link function. (compile function not needed) return function(scope,element,attrs) { var format,// date format stopTime; // so that we can cancel the time updates // used to update the UI function updatetiR_4_11845@e() { element.text(dateFilter(new Date(),format)); } // watch the expression,and update the UI on change. scope.$watch(attrs.myCurrentTime,function(value) { format = value; updatetiR_4_11845@e(); }); stopTime = $interval(updatetiR_4_11845@e,1000); // listen on DOM destroy (removal) event,and cancel the next UI update // to prevent updating time after the DOM element was removed. element.on('$destroy',function() { $interval.cancel(stopTimE); }); } }]); </script> <div> <div ng-controller="ExampleController"> <label>Date format: <input ng-model="format"></label> <hr/> Current time is: <span my-current-time="format"></span> <hr/> Blood 1 : <font color='red'>{{Blood_1}}</font> Blood 2 : <font color='red'>{{Blood_2}}</font> <button type="button" data-ng-click="fight()">fight</button> <button type="button" data-ng-click="stopfight()">Stopfight</button> <button type="button" data-ng-click="resetfight()">resetfight</button> </div> </div> </body> </html> <!-- Copyright 2017 Google Inc. All Rights Reserved. Use of this source code is governed by an MIT-style license that can be found in the LICENSE file at http://angular.io/license -->
以上是大佬教程为你收集整理的angularjs-$interval全部内容,希望文章能够帮你解决angularjs-$interval所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。