Angular Js: Conditionally, how to disable all buttons and links?

I have one condition in the controller. If the condition returns true, then I need to disable all links and ng-clicks

How can we do: -

Controller : $scope.disableActions = true;

In HTML

<button type="button" ng-click="ignoreAndRedisplay()" ng-disabled="disableActions">OpenClick</button>

So, doing this, I have to write everywhere ng-disabled="disableActions", it will be redundant. How can we improve this for the nnumber of buttons and links?

+4
source share
6 answers

, fieldset ng-disabled fieldset, , , disabled ng-disabled true

<fieldset ng-disabled="disableActions">
   <button type="button" ng-click="ignoreAndRedisplay()">OpenClick</button>
   <button type="button" >Some Other button</button>
   <button type="button" >One more button</button>
   ...
</fieldset>


, anchor. anchor. , .

fieldset[disabled] a { 
   pointer-events: none;
}

Plunker

+8

ng-disabled . .

n , ,

$watch('disableAction',function(value){
   if(value==true){ 
    //use a selector here to select all your a and button elts and add a 
    //disabled="disabled" attribute.
   }
   else {
   // remove that disabled attribute
   }
});
+1

, ng-disabled - , JinsPeter

+1

, ng-disabled, buttons , . .

+1

ng-disabled . $scope.disableActions .

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.3/angular.min.js"></script>
<body ng-app ng-init="disableActions = false">
<button ng-disabled="!disableActions">OpenClick</button>
<button ng-disabled="!disableActions">Second Click</button>
<button ng-disabled="!disableActions">Third Click</button>
<button type="button" ng-click="disableActions = !disableActions">Enable/Disable</button>
</body>
Hide result
0

ng-disabled , . , .

$scope.ignoreAndRedisplay = function () {
    if ($scope.disableActions) return;
    // your code here
}
0

Source: https://habr.com/ru/post/1675788/


All Articles