プロプログラマ -Flex,Air,C#,Oracle,HTML5+JS-

プログラマーを職業としてます。 Flex,Air,C#,Oracle,HTML+JSの言語ノウハウを中心に情報発信していきます

[Angular] select-optionでvalueにnullをセットしたいとき

Angularのテンプレートでselect-optionを定義するとき、”全て”や”未指定”を入れるときにvalueが空の値をセットしたい場合があります

<select  name="resultOption" [(ngModel)]="result1">
                  <option [value]="null">全て</option>
                  <option [value]="1">北海道</option>
                  <option [value]="2">青森県</option>

[value]=”null”とすると、全てを選択したとき、null値ではなく、”null”という文字列がresult1にbindされてしまう

【解決策】
[value]を[ngValue]に変えるとnull値がセットされる

<select name="resultOption" [(ngModel)]="result1">
                  <option [ngValue]="null">全て</option>
                  <option [value]="1">北海道</option>
                  <option [value]="2">青森県</option>

★valueは常に文字列で扱う

★ ngValueはobjectを含むそのものの型で扱う

 

== ランキングに参加しています。ぜひクリックお願いします ==

プログラム ブログランキングへ
にほんブログ村 IT技術ブログへ
にほんブログ村

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です