Disable a div in AngularJS with ng-click property?

Question

I need to disable a div in AngularJS depend on a condition. Yes I can do it by using css change (giving low contrast and less color appearance) in appearance but I have ng-click property in it. So I need to prevent that calling also. How can I do it?

Here is my code:

<div ng-repeat="item in list.items" ng-click="goToFunction()" ng-disabled="true">

Answer 1

Yes ng-disabled does not work for div. It will for each html element which support the disable property (eg : input). https://docs.angularjs.org/api/ng/directive/ngDisabled

I created a simple fiddle to demonstrate how to achieve it with a simple div http://jsfiddle.net/5Qc5k/1/

function MyCtrl($scope, $templateCache) {
    $scope.isDisabled = false;
    $scope.alertMe = function(){
        if($scope.isDisabled === true){
            return;
        }
        // disable the function
        $scope.isDisabled = true;


        alert("foo");
    }
}