[（）]構文を使用しないでngModelディレクティブのバッキングプロパティを指定する場合

Question

編集している角型の例を見ると、ngModelキーワードをバッキングプロパティ名に割り当てずに使用する例があります。

<input ngModel required type="password" class="form-control" name="password" id="password" placeholder="Password" > 

私は通常、私たちが割り当てすることなく、第1例の平野ngModelディレクティブを使用する場合は、どのようなバッキングプロパティがにバインドされた入力データのですか？[ngModel]="password"または[(ngModel)]="password"

の結合ブラケットでそれを参照してくださいそれは何にも縛られておらず、form.valuesからのみアクセス可能ですか？どのようなユースケースでは、プレーンなngModelディレクティブを使用したいですか？バインディングを必要とせず、フォーム値からのみアクセスしたい場合あなたがフィールドにバインドしたくない場合に

Answer 1

私の心に来るユースケースはあるが、あなたはそれが変化したときに、次のコードは動作しません

<input ngModel (ngModelChange)="updateModel($event)" 

のように、あなたのモデルを更新したいですngModelChangeがNgModelディレクティブ

<input (ngModelChange)="updateModel($event)" 

に一致するセレクタではありませんので、したがって、あなたは、バーngModelがNgModelディレクティブが適用され得るとngModelChangeイベントを取得するために追加します。

Answer 2

ngModelは、入力フィールドをngFormディレクティブに登録します。入力の名前がキーとして使用されます。

一部-component.html

<form novalidate (ngSubmit)="save(form.value)" #form="ngForm" > 
    <input type="text" name="title" ngModel /> 
    <button type="submit" [disabled]="!form.valid">save</button> 
</form> 

一部-component.ts

... 
save(value: any) { 
    console.log(value.title); 
} 

あなたが入力フィールドからngModelを削除する場合は、value.titleがなくなっている（未定義）。