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>
Or you can use ng-disabled="condition1 || condition2" , is depend of you logic conditional.
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 .
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.
The ng-click directive tells AngularJS what to do when an HTML element is clicked.
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)"
You should change DIV tag to Button Tag. It works for me.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With