计数器的中间值(intermediate values of counter)
请帮助修复脚本。 http://jsfiddle.net/k9r4t/
在盘旋时 button_hover增加计数器的值。 但是当光标离开时,计数器的值显示在屏幕上。 button_hover。 并且用户只能看到计数器的初始值和最终值。
我希望用户看到中间值
控制器代码:
var app = angular.module("moduleCounter", []); app.controller("controllerCounter", function ($scope){ $scope.counter = 0; $scope.incrementCounter = function(){ $scope.startNext = setInterval(function(){ $scope.counter++; }, 400); } $scope.stopCounter = function(){ clearInterval($scope.startNext); } });please help to fix the script. http://jsfiddle.net/k9r4t/
when hovering. button_hover increasing the value of the counter. but the value of the counter is displayed on the screen when the cursor leaves the. button_hover. and the user sees only the initial and final value of the counter.
I would like the user to see the intermediate values
controller code:
var app = angular.module("moduleCounter", []); app.controller("controllerCounter", function ($scope){ $scope.counter = 0; $scope.incrementCounter = function(){ $scope.startNext = setInterval(function(){ $scope.counter++; }, 400); } $scope.stopCounter = function(){ clearInterval($scope.startNext); } });最满意答案
使用$timeout ,它是Angular的本机服务:
var app = angular.module("moduleCounter", []); app.controller("controllerCounter", function ($scope , $timeout){ $scope.counter = 0; $scope.incrementCounter = function(){ $scope.setTimeout(); } $scope.setTimeout = function(){ $scope.startNext = $timeout( $scope.counterUp , 400); } $scope.counterUp = function(){ $scope.counter++; $scope.setTimeout(); } $scope.stopCounter = function(){ $timeout.cancel($scope.startNext); } });JSFiddle: http : //jsfiddle.net/cherniv/k9r4t/1/
Use $timeout , it is Angular's native service:
var app = angular.module("moduleCounter", []); app.controller("controllerCounter", function ($scope , $timeout){ $scope.counter = 0; $scope.incrementCounter = function(){ $scope.setTimeout(); } $scope.setTimeout = function(){ $scope.startNext = $timeout( $scope.counterUp , 400); } $scope.counterUp = function(){ $scope.counter++; $scope.setTimeout(); } $scope.stopCounter = function(){ $timeout.cancel($scope.startNext); } });JSFiddle: http://jsfiddle.net/cherniv/k9r4t/1/
更多推荐
发布评论