码迷,mamicode.com
首页 > 其他好文 > 详细

angular——倒计时

时间:2016-04-20 00:40:33      阅读:227      评论:0      收藏:0      [点我收藏+]

标签:

       <div class="top_10 input_box">
                <label class="item item-input">
                    <i class="icon ion-chatbubble-working placeholder-icon"></i>
                    <input type="tel" placeholder="请输入短信验证码" autofocus ng-model="data.verifyMessage">
                </label>

                <input type="button" class="button retrieve font_16_14 button-calm white_text"
                       ng-disabled="data.retrieveDisabled"
                       ng-value="data.retrieveText" ng-model="data.retrieveText" ng-click="action.retrieve()">
            </div>
angular.module(‘MrTrustApp.controllers‘)

    .controller(‘AuthSendVerifyMessageCtrl‘, function ($scope, StateGo, $stateParams, $interval, $ionicLoading, $timeout) {

        //定义数据
        $scope.data = {

            retrieveDisabled: true,   //重新获取按钮默认不可用

            isChecked: true,         //接受协议默认勾选

            disabled: true,         //注册/登录按钮默认不可用

            retrieveText: ‘重新获取(59s)‘, //重新获取倒计时文字

            isLogin: false         //true:登录 , false:注册 (是否为登录)

        };

//显示号码部分数字
        $scope.data.showPhoneNumber = phoneNumber.slice(0, 3) + ‘****‘ + phoneNumber.slice(7);
//倒计时样式控制
        function countdown() {
            var second = 59,
                timePromise = undefined;

            timePromise = $interval(function () {
                if (second < 1) {

                    $scope.data.retrieveDisabled = false;

                    $interval.cancel(timePromise);
                    timePromise = undefined;

                    $scope.data.retrieveText = "重新获取";
                    second = 59;

                } else {
                    $scope.data.retrieveText = ‘重新获取(‘ + second + ‘s)‘;

                    second--;

                    $scope.data.retrieveDisabled = true;


                }
            }, 1000, 100);
        }

        countdown();


        //重新获取验证码
        $scope.action.retrieve = function () {
            countdown();
            return false;
            <!--  TODO: 告诉后台,给用户发送验证码   -->

        };
});

 

angular——倒计时

标签:

原文地址:http://www.cnblogs.com/hu-clover/p/5410759.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!