CODEWITHSUNDEEP
angular
infodev
infodev

Reputation: 5245

ngClass not getting applied

I have to apply a css style to an input depending on a var value

HTML

 <input class="defaultInput" [ngClass]="{'inputerror':'emptyFields'}" formControlName="idAnnuaire" placeholder="Ex: c20011">

CSS 

.inputerror {
    border: 1px solid red;
}

Emtyfields is well changed from false to true but the ``.inputerror` is not applied to input

Upvotes: 2

Views: 119

Answers (2)

manish kumar
manish kumar

Reputation: 4692

emptyFields has to be a variable , you have mentioned as a string.

<input class="defaultInput" [ngClass]="{'inputerror':emptyFields}" formControlName="idAnnuaire" placeholder="Ex: c20011">

working example

I have removed the formContrlName for now

Upvotes: 1

FAISAL
FAISAL

Reputation: 34673

You need to specify emptyFields property without the single quotes i.e. [ngClass]="{'inputerror':emptyFields}".

Change your template code to following: 

<input class="defaultInput" 
       [ngClass]="{'inputerror':emptyFields}"
       formControlName="idAnnuaire" 
       placeholder="Ex: c20011">

Upvotes: 5

Related Questions