条件付きCSSクラスを入力要素に適用する

Question

条件付きでCSSクラスを適用する入力フィールドがあります。

たとえば、firstName == undefinedがCSSクラスng-dirtyを適用するとします。だから、私は試しました

<input required [(ngModel)]="customer.firstName" name="firstName"   
     type="text" minlength="2" maxlength="50" ng-class="{ng-dirty : customer.firstName === undefined}"> 

しかし、それは動作しません。

Answer 1

を実現するために引用符がNgClass

の条件付き構文であります

<some-element [ngClass]="{'first': true, 'second': true, 'third': false}">...</some-element> 

とあなたがangularJs（すなわち角度の1.x）を使用している場合は、

<some-element ng-class="{'fist' : true, 'second': true}">...</some-element> 

の下に使用します

Official DOcs for AngularJS ng-class

希望は、このことができます:)

Answer 2

あなたはこの試みることができる：

<input required [(ngModel)]="customer.firstName" name="firstName"   
     type="text" minlength="2" maxlength="50" [class]="(customer.firstName == undefined) ? 'dirty' : ''" > 

をしかし、私はあなたがモデルにそれを置くとき、あなたはそれを定義したので、customer.firstNameはこれまで、不定になりますとは思いません。

Answer 3

jsオブジェクト表記を持つことはできません - ダッシュをあなたが必要とするすべてはあなたが以下の角度角度2/4を使用している場合、それは

<input required [(ngModel)]="customer.firstName" name="firstName"   
    type="text" minlength="2" maxlength="50" ng-class="{'ng-dirty' : customer.firstName === undefined}">