Disable ng-click on certain conditions of application for all types of element

Question

In my application I've binded several elements with ng-click directive like below

<a ng-click="DoSomething()"/>
<button ng-click="DoSomethingElse()">xyz</button>
<span ng-click="DoSomething()"></span>

Now in my application in certain scenarios I want default behavior of ng-click to happen, but in certain scenarios I want to completely disable the callback function(DoSomething(), DoSomethingElse()..) to be called..

For checking this scenarios I've one scope variable say $scope.IsClickEnable = true/false;

So how can I accomplish this kind of behaviour?

I can use ng-disable to disable elements but it will only work on button kind of elements, so that will not work in my scenario

And I can also check conditions in every function call but I want more specific way to accomplish this by overriding ng-click behavior or something..

Circulation

Refer docs.angularjs.org/api/ng/directive/ngDisabled – Cohen

@ArpitSrivastava It will not work on all types of elements – Circulation

Have a look to this thread #16353885 – Cohen

Answer 1

Do like this:

<button ng-click="!IsClickEnable||DoSomethingElse()">xyz</button>

when the value of IsClickEnable is true then the function will be called on the button click then the function 'DoSomethingElse()' will be called else it will not get called

Epineurium

There is also some another syntax like this <button ng-click="IsClickEnable?DoSomethingElse():null">xyz</button>. IsClickEnable is true then the function will be called – Epineurium

For readability I think it is easier to write it like this <button ng-click="IsClickEnable && DoSomethingElse()">xyz</button> – Kitkitchen