以下に、[(ngModel)]を使用したselect要素の例を示します。
<select [(ngModel)]="selectedOption">
<option value="option1">オプション1</option>
<option value="option2">オプション2</option>
<option value="option3">オプション3</option>
</select>
上記の例では、selectedOption
というコンポーネントのプロパティを選択されたオプションの値にバインドしています。選択されたオプションの値は、selectedOption
に自動的に反映されます。
また、選択された値の変更を検知するために、ngModelChange
イベントを使用することもできます。以下に例を示します。
<select [(ngModel)]="selectedOption" (ngModelChange)="onOptionChange($event)">
<option value="option1">オプション1</option>
<option value="option2">オプション2</option>
<option value="option3">オプション3</option>
</select>
上記の例では、onOptionChange
というコンポーネントのメソッドを定義し、選択された値の変更時に呼び出しています。
以上が、Angularでselect要素で[(ngModel)]を使用する方法の簡単な例です。これによって、選択された値をコンポーネント内で利用したり、他の処理に使用したりすることができます。