web-dev-qa-db-ja.com

Angular2でブール値がtrueの場合、チェックボックスがオンになっています

値がtrueの場合にチェックボックスをオンにし、Angular2でfalseの場合にオフにする方法を知りたいです。

Adult <input type="checkbox" value="{{person.is_adult}}">

{{person.is_adult}}はbooleanです

誰かが何か提案できますか?ありがとう

17
jiji

{{}}は文字列補間を行い、truefalseを文字列化し、Angularはデフォルトでプロパティバインディングを使用し、プロパティは文字列ではなくブール値を想定しています。

<input type="checkbox" [checked]="person.is_adult">

これもうまくいくかもしれません

<input type="checkbox" attr.checked="{{person.is_adult}}">

属性をバインドすると、ブラウザはそのプロパティに読み込むときに属性(文字列のみ)からブール値に変換する可能性があるためです。

checkedの代わりにvalueでもあります

ngModelを使用することもできます

<input type="checkbox" [ngModel]"person.is_adult" name="isAdult">
<input type="checkbox" [(ngModel)]"person.is_adult" name="isAdult">

一方向または双方向バインディングの場合。
FormsModuleを使用する場合は、ngModelがインポートされていることを確認してください。

23

チェックの周りに角かっこがありません

<input type="checkbox" [checked]="person.is_adult">

お役に立てれば!!

14
Madhu Ranjan