Question

我正在使用ng-disabled指令来控制何时可以点击页面上的按钮。是否可以通过计时器控制它？我希望按钮被移除直到5秒钟过去。我的HTML目前是：

<div ng-controller="ResetController">
    <button ng-click="reset()">Reset</button>
</div>

Answer 1

您可以使用$timeout：

$timeout(function() {
   $scope.buttonEnabled = true;
}, 5000);

在你的HTML中：

<button ng-click="reset()" ng-disabled="!buttonEnabled">Reset</button>

另外，不要忘记将$timeout注入控制器。像任何其他角度服务（例如$http）。

Answer 2

ng-enabled不在核心，但ng-disabled基于true或false进行求值，因此只需使用超时在相应的启用时间之后将变量赋值为true。

HTML：

<button ng-disabled="isDisabled">click me after 3 seconds</button>

控制器：

function($scope, $timeout) {
  $scope.isDisabled= true;
  $timeout(function(){
    $scope.isDisabled= false;
  }, 3000)
}

Answer 3

您需要在控制器中设置变量，然后使用该变量设置ng-disabled。

例如，假设控制器ExampleController在控制器中注册为＆＃34;示例＆＃34;：

(function() {
    'use strict';
    angular.module('app').controller('ExampleController',ExampleController);
    ExampleController.$inject = ['$timeout'];

    function ExampleController($timeout) {
        var vm = this;
        vm.buttonDisabled = true;
        $timeout(function() { 
            vm.buttonDisabled = false;
        }, 5000);
    }
})();

然后在你的模板中：

<input type="button" ng-disabled="example.buttonDisabled"/>

Answer 4

您需要按照上一个答案使用超时...

$scope.buttonDisabled = true;

$timeout(function() {
   $scope.buttonDisabled = false;
}, 5000);

不要忘记在控制器/服务中注入$ timeout。

然后在你的HTML中做...

<div ng-controller="ResetController">
    <button ng-click="reset()" ng-disabled="buttonDisabled">Reset</button>
</div>

Answer 5

试试这个：

var interval= setInterval(timePassed, 1000);
function timePassed() {
   $scope.buttonEnabled = true;
}

和

<input type="button" ng-enabled="buttonEnabled"/>

如何使用AngularJS延迟启用按钮？

5 个答案: