Not possible to change button class with angular?


#1

I try this code :

< div class=“button-bar”>
< button ng-class="{ button-outline : !myBoolean }" class=“button button-positive” ng-click=“myBoolean=!myBoolean”>Créer< /button>
< button ng-class="{ button-outline : myBoolean }" class=“button button-positive” ng-click=“myBoolean=!myBoolean”>Rejoindre< /button>
< /div>

My boolean is initialized in the contructor :

$scope.myBoolean = true;

It doesn’t work, is this because of ionic ?


#2

I just notice that it’s because of the ‘-’ character in the class.

[console.error] Error: [$parse:syntax] Syntax Error: Token ‘-’ is unexpected, expecting [:] at column 9 of the expression [{ button-outline : !myBoolean }] starting at [-outline : !myBoolean }].

So how can I do it ?


#3

Try something like that :

< button ng-class=“getClass()” class=“button button-positive” ng-click=“myBoolean=!myBoolean”>Créer< /button>

In Controler :

$scope.getClass = function() {
if ($scope.myBoolean) {return “button-outline”;}
return “”;
}


#4

ng-class="{ ‘button-outline’ : !myBoolean }"

wrap it as a string and you should be good to go :slight_smile:


#5

it works with the ‘’. Thank you for answering