在mat中设置默认选项-选择
我在Angular material项目中有一个简单的选择选项表单字段：
component.html
<mat-form-field>
<mat-select [(value)]="modeSelect" placeholder="Mode">
<mat-option value="domain">Domain</mat-option>
<mat-option value="exact">Exact</mat-option>
</mat-select>
</mat-form-field>其中，[(value)]="modeSelect"绑定到component.ts文件中的modeSelect属性
我想让它在页面加载时默认选择<mat-option value="domain">Domain</mat-option>。
ng-selected对我不起作用
回答 11
Stack Overflow用户
发布于 2020-03-20 03:11:49
这个问题困扰了我一段时间。我使用的是反应式表单，我用这种方法修复了它。PS。使用角度9和材质9。
在"ngOnInit“生命周期钩子中
1)从数组或对象文字中获取要设置为默认值的对象
const countryDefault = this.countries.find(c => c.number === '826');在这里，我从我的countries数组中抓取了英国对象。
2)然后将formsbuilder对象( mat-select)设置为默认值。
this.addressForm.get('country').setValue(countryDefault.name);3) Lastly...set绑定值属性。在我的例子中，我需要name值。
<mat-select formControlName="country">
<mat-option *ngFor="let country of countries" [value]="country.name" >
{{country.name}}
</mat-option>
</mat-select>就像一种护身符。我希望它能帮上忙
Stack Overflow用户
发布于 2018-06-02 05:21:45
尝尝这个
<mat-form-field>
<mat-select [(ngModel)]="modeselect" [placeholder]="modeselect">
<mat-option value="domain">Domain</mat-option>
<mat-option value="exact">Exact</mat-option>
</mat-select>
</mat-form-field>组件：
export class SelectValueBindingExample {
public modeselect = 'Domain';
}另外，不要忘记在app.module中导入FormsModule
Stack Overflow用户
发布于 2020-03-30 17:10:05
我想在这里补充Narm的答案，并在她的答案下面添加了与评论相同的内容。
基本上，分配给( value )的值的数据类型应该与用于mat-options的value属性的数据类型相匹配。特别是如果有人使用*ngFor填充选项，如下所示
<mat-form-field fxHide.gt-sm='true'>
<mat-select [(value)]="heroes[0].id">
<mat-option *ngFor="let hero of heroes" [value]="hero.id">{{ hero.name }}</mat-option>
</mat-select>
</mat-form-field>请注意，如果您将(value)="heroes.id“更改为(value)="heroes.name”，它将不起作用，因为数据类型不匹配。
这些是我的发现，如果需要，请随时纠正我。
https://stackoverflow.com/questions/50650790
复制相似问题