Question

我正在使用Angular 2和Angular Material。查看文档，我试图让select具有默认值，与空占位符相反。

我尝试了以下两个选项，但两者都没有设置默认值

<md-select selected="1">
  <md-option value="1" >One</md-option>
  <md-option value="2">Two</md-option>
</md-select>

<md-select>
  <md-option value="1" selected="true">One</md-option>
  <md-option value="2">Two</md-option>
</md-select>

我查看了所有文档和示例，其中没有帮助

Answer 1

使用[(ngModel)]：

<mat-select [(ngModel)]="selectedOption">
  <mat-option value="1">One</mat-option>
  <mat-option value="2">Two</mat-option>
</mat-select>

<强>组件：

this.selectedOption = '1';

编辑＃1：

自Material2.0.0#beta10（具体为this PR）后，您可以使用value的{{1}} 属性选择值：

MdSelect

<强>组件：

<mat-select [value]="selectedOption">
  <mat-option value="1">One</mat-option>
  <mat-option value="2">Two</mat-option>
</mat-select>

请注意，您也可以将其用于双向数据绑定 - ＆gt; [（值）]

DEMO

Answer 2

 <mat-select [value]="0" >

我们可以轻松地将设置值设置为默认值

Answer 3

根据documentation，您可以通过以下方式进行操作。

选项：1

<md-select value={{ defaultValue }}>
  <md-option value="{{ defaultValue }}">{{defaultValue}}</md-option>
  <md-option value="1">One</md-option>
  <md-option value="1">One</md-option>
  <md-option value="2">Two</md-option>
</md-select>

选项：2

<md-select value="None">
  <md-option value="None">None</md-option>
  <md-option value="1">One</md-option>
  <md-option value="1">One</md-option>
  <md-option value="2">Two</md-option>
</md-select>

它必须是选择下拉列表的任何值。否则它将无法正常工作。

Answer 4

<mat-select formControlName="timezone" required [(ngModel)]="selectedOption">
      <mat-option *ngFor="let item of array" [value]="item.value">{{item.name}}</mat-option>
</mat-select>

为了正确的工作需要绑定值 [value] 否则它不起作用

Angular Material md-select默认选择值

4 个答案: