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

在Angular 4中，可以通过使用Angular Forms模块中的FormControl和ngModel指令来实现将所选值绑定到下拉列表。

首先，确保已导入FormsModule模块：

import { FormsModule } from '@angular/forms';

@NgModule({
  imports: [
    FormsModule
  ],
})
export class AppModule { }

在组件的HTML模板中，使用ngModel指令将所选值与下拉列表进行双向绑定：

<select [(ngModel)]="selectedValue">
  <option *ngFor="let option of options" [value]="option">{{option}}</option>
</select>

在组件的TypeScript文件中，定义一个selectedValue属性来存储所选值，并为options数组赋予下拉列表的选项：

export class YourComponent {
  selectedValue: string;
  options: string[] = ['Option 1', 'Option 2', 'Option 3'];
}

通过上述代码，所选值将与selectedValue属性进行双向绑定。当选择下拉列表中的选项时，selectedValue属性将自动更新为所选值。反之，当在组件中更改selectedValue属性时，下拉列表将反映出相应的变化。

这种方式可以方便地将所选值与下拉列表进行绑定，并在用户选择其他选项时获取新的值。

腾讯云相关产品和产品介绍链接地址：

• 腾讯云云服务器（CVM）：https://cloud.tencent.com/product/cvm
• 腾讯云云原生容器服务（TKE）：https://cloud.tencent.com/product/tke
• 腾讯云对象存储（COS）：https://cloud.tencent.com/product/cos
• 腾讯云人工智能（AI）：https://cloud.tencent.com/product/ai
• 腾讯云区块链服务（BCS）：https://cloud.tencent.com/product/bcs