hashbyte
hashbyte

Reputation: 121

ionic 3 dynamic class (ngClass)

So I am pretty new to this. I using Ionic 3 and trying to dynamically choose which class to use based on a condition but I cannot get ngClass to work... Any help would be appreciated.

    <div ng-class="test: data[i].complete ? 'completed' : 'notCompleted'>
      <div class="dueDate">{{ data[i].dueDate }}</div>
      <div class="taskLabel">{{ data[i].taskLabel }}</div>
      <div class="checkBox">
        <img src="{{ data[i].complete_url }}" style="width : 100% ; height : 100%" (click)="CheckBox(i)">
      </div>
    </div>

Upvotes: 6

Views: 15851

Answers (2)

Berk Akkerman
Berk Akkerman

Reputation: 483

[class.x]="condition" adds x class to the element if condition is true

 <div  [class.completed]="data[i].complete" [class.myNotCompleted]="!data[i].complete">

Upvotes: 3

Sajeetharan
Sajeetharan

Reputation: 222592

You are using angularjs syntax wih angular, it should be something like this,

[ngClass]="test===data[i].complete?'completed':'my-notCompleted'"

Upvotes: 5

Related Questions