Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

ng-click still fires when div is (ng)disabled

Problem is that ng-click works on so event if cancelTicket === false it still fires ng-click. How can I stop that?

<div class="btn-block save-changes padding-10" ng-class="{'gray':cancelTicket===false,'secondary-button':cancelTicket===true}" ng-click="CancelTicket(ticketPin)" ng-disabled="cancelTicket===false" style="display: table;">     <div class="button-container padding3" ng-class="{'pointer':cancelTicket===true}">         <button-spinner promise="cancelPromise"></button-spinner>         <div style="display: inline-block !important;"> @Translator.Translate("CANCEL") </div>     </div> </div> 
like image 492
None Avatar asked Aug 14 '15 08:08

None


People also ask

How do I give conditions in NG disabled?

Or you can use ng-disabled="condition1 || condition2" , is depend of you logic conditional.

How does ng disabled work?

Definition and Usage The ng-disabled directive sets the disabled attribute of a form field (input, select, or textarea). The form field will be disabled if the expression inside the ng-disabled attribute returns true. The ng-disabled directive is necessary to be able to shift the value between true and false .

What is the difference between Ng-click and Onclick?

Another significant difference between ng-click and onclick is the execution context. Code inside an onclick attribute executes against the global window object, while an expression inside of ng-click executes against a specific scope object, typically the scope object representing the model for the current controller.

What is the use of NG-click?

The ng-click directive tells AngularJS what to do when an HTML element is clicked.


2 Answers

Event is triggered even if the div is disabled.

You can avoid this by using lazy evaluation of expressions like isDisabled || action() so action would not be called if isDisabled is true.

In your case it will be:

ng-click="cancelTicket === false || CancelTicket(ticketPin)" 
like image 159
Erazihel Avatar answered Sep 18 '22 19:09

Erazihel


You should change DIV tag to Button Tag. It works for me.

like image 45
Huy Ho Avatar answered Sep 18 '22 19:09

Huy Ho