如何将所选值绑定到Angular 4中的下拉列表答案

【问题标题】：How to bind selected value to dropdown list in Angular 4如何将所选值绑定到Angular 4中的下拉列表
【发布时间】：2017-10-25 06:02:24
【问题描述】：

我有一个包含课程列表的下拉列表..例如，一名学生选择了一门课程并保存了所有详细信息。在编辑时，我们如何将所选课程绑定到 Angular 4 中的下拉菜单请任何人帮助我。

【问题讨论】：

现在我正在使用 angularjs 4，谁说没有 angularjs 4？
好吧！！是的，没有 angularjs 4 但有 angular 4 。仅供参考。其次，请您在这里发布一些代码。

标签： angular

【解决方案1】：

你可以这样做：

<select class='select-option' required [(ngModel)]='optionSelected' (ngModelChange)='onOptionsSelected($event)'>
    <option class='option' *ngFor='let option of options' [value]="option">{{option}}</option>
</select>

因此，无论何时更改，该值都存储在TS中的optionSelected中，

options = [1, 2, 3];
optionSelected: any;

onOptionsSelected(event){
 console.log(event); //option value will be sent as event
}

（固定模板中的functionName和ts要相同）

【讨论】：

【解决方案2】：

(ngModelChange)='onOptionsSelected($event)'

onOptionsSelected($event){
 console.log($event);
}

【讨论】：

您好，感谢您的贡献，请注意规则说您不应该只编写代码答案。请阅读Help Center > Answering 并尝试仅提供good answers

【解决方案3】：

添加 2 个 ngModel，其中一个用于绑定，另一个用于选定值，它适用于我

【讨论】：

您能否在答案中添加一些代码以阐明您的意思？

【解决方案4】：

尝试简单

 <select (change)="showEntity($event.target.value)">
   <option value="2">2</option>
   <option value="4">4</option>
   <option value="5">5</option>
 </select>

在 .ts 文件中

showEntity(e){
console.log(e)
}

【讨论】：