Отключить ссылку после нажатия на угловой js

Question

Может ли кто-нибудь помочь мне с решением. Мне нужно отключить связь (PAY Now) после нажатия на нее, чтобы избежать многократного нажатия.

<div class="Class1" data-ng-show="ShowButton == 'TRUE'"> 
<a href="javascript:void(0);" data-ng-click="PayNow()" class="btn-register">PAY NOW</a></div> 

Answer 1

Вы можете в функции PayNow() создает дополнительную переменную, которая отключает кнопку следующим образом:

JS:

$scope.PayNow = function() { 
    $scope.DisabledButton = true; 
    // other code 
} 

HTML

<a href="javascript:void(0);" data-ng-click="PayNow()" class="btn-register" ng-disabled="DisabledButton">PAY NOW</a> 

Answer 2

Нет отключен для hyperlinks. Если вы не хотите что-то делать с этим, вам нужно добавить какой-то стиль в тег <a> и обработать флаг в контроллере.

Попробуйте это:

angular.module('myApp', []) 
 
    .controller('myCtrl', ['$scope', function($scope) { 
 
    $scope.isDisabled = false; 
 
    if($scope.isDisabled === false) { 
 
     $scope.PayNow = function() { 
 
     $scope.isDisabled = true; 
 
     } 
 
    } 
 
    }]);

.disabled { 
 
    cursor: not-allowed; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
    <a href="javascript:void(0)" ng-click="PayNow()" ng-class="{disabled: isDisabled}">PAY NOW</a> 
 
</div>

Answer 3

В вашем HTML

 .disabled { 
      cursor: not-allowed; 
     } 

     <a ng-click="PayNow()" ng-class="{'disabled': DisabledButton}">Add</a> 
OR 

<button ng-click="PayNow()" ng-disabled="DisabledButton">Add</button> 

В JS

$scope.DisabledButton = false; 
$scope.PayNow = function() { 
    $scope.DisabledButton = true; 
    // other code 
    ... 
    //when you want to re-enable 
    $scope.DisabledButton = false; 
}