Conditional ng-click on AngularJS

Question

I have a code inside ng-repeat

<tr ng-repeat="location in assetLocations track">     
    <span class="fa fa-remove fa-lg text-danger" style="cursor: pointer;"
                        ng-show="location.isEdit"
                        ng-click="readOnly===false ? (cancel();location.isEdit = false; updateClicked = false;) : null"></span>
</tr>

Here location.isEdit property is set on the fly.

I want to set a conditional ng-click to span. But the code above gives the following error

angular.js:11598 Error: [$parse:syntax] Syntax Error: Token ';' is unexpected, >>expecting [)] at column 29 of the expression [readOnly===false ? >>(cancel();location.isEdit = false; updateClicked = false;) : null] starting at >>[;location.isEdit = false; updateClicked = false;) : null].

I can set the variables inside the function, but I need to set the variables and call the functions on ng-click

How to use the conditional ng-click for this type of scenario?

Immanuel Kirubaharan · Accepted Answer · 2018-10-17 10:13:37Z

2

You can try something like the below code,

Controller:

$scope.conditionCancelClick = function(location){
    if(!$scope.readOnly){
        $scope.cancel();
        location.isEdit = false;
        $scope.updateClicked = false;
    }
}

Template:

<tr ng-repeat="location in assetLocations track">  
    <span class="fa fa-remove fa-lg text-danger" style="cursor: pointer;" 
          ng-show="location.isEdit" ng-click="conditionCancelClick(location)"></span>
</tr>

answered Oct 17, 2018 at 10:13

Immanuel Kirubaharan

1,1041 gold badge11 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Gaurav Singh · Accepted Answer · 2018-10-17 12:08:40Z

0

try replacing ; to , as

<tr ng-repeat="location in assetLocations track">     
    <span class="fa fa-remove fa-lg text-danger" style="cursor: pointer;"
                        ng-show="location.isEdit"
                        ng-click="readOnly===false ? (cancel(),location.isEdit 
= false, updateClicked = false) : null"></span>
</tr>

answered Oct 17, 2018 at 12:08

Gaurav Singh

3691 silver badge6 bronze badges

Collectives™ on Stack Overflow

Conditional ng-click on AngularJS

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related