<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: 告訴後臺,給用戶發送驗證碼 --> }; });