ionic 3 dynamic class (ngClass)

Question

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>

Chaconne

Answer 1

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

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

Yepez

okay im now using <div [ngClass]="(test==data[i].complete )?'completed':'notCompleted'"> and it still doesnt work... – Chaconne

try the modified one – Yepez

Is test really part of the condition? Isn't it just data[i].complete? I don't know what test: means in the question. – Paresthesia

oh i understood your logic wrong, what is the condition that you are checking? – Yepez

awesome. i believe that was it.. i ended up using <div [ngClass]="(data[i].complete)?'completed':'notCompleted'"> if that ends up helping anyone in the future – Chaconne

Answer 2

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

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

Sweatt

Don't write code-only answers, instead, please explain how your code would help solve the OP's problem. From Review – Vernacularism