是否可以显示初始值为 selected 的 angular material 的多个 select 组件?
is it possible to show an angular material's multi select component with initial value selected?
我有一个多select表单控件
<form [formGroup]="form">
<mat-form-field appearance="outline">
<mat-select formControlName="años" multiple placeholder="Años">
<mat-option *ngFor="let year of years" [value]="year">{{year}}</mat-option>
</mat-select>
</mat-form-field>
但我想将实际年份标记为 select,即 2021
export class FiltroOfertasComponent implements OnInit {
private now:Date=new Date();
actualYear:number=this.now.getFullYear();
years:number[]=[this.actualYear-2, this.actualYear-1, this.actualYear];
form: FormGroup;
formularioOriginal = {
años:[this.actualYear],
fechaPresentada: '',
descripcion: '',
organismoId: 0,
presentada: false,
adjudicada: false
}
constructor(private formBuilder: FormBuilder) { }
this.form = this.formBuilder.group(this.formularioOriginal);
但这并没有显示设置原始形式时的默认 selected 值
这都不是
formularioOriginal = {
años:this.actualYear,
fechaPresentada: '',
descripcion: '',
organismoId: 0,
presentada: false,
adjudicada: false
}
这都不是
this.form = this.formBuilder.group(this.formularioOriginal);
this.form.patchValue({
años:this.actualYear
});
是一个multi-select不知道怎么给它传初值
有什么想法吗?
谢谢
您收到以下错误消息:
ERROR
Error: Uncaught (in promise): Error: Value must be an array in multiple-selection mode.
Error: Value must be an array in multiple-selection mode.
有两种方法可以将默认值作为数组传递给 multi-select:
要么在构建表单后修补该值:
this.form.patchValue({
años: [this.actualYear]
});
或者您在表单生成器中设置值,在您的代码中它看起来像这样:
formularioOriginal = {
años:[[this.actualYear]],
fechaPresentada: '',
descripcion: '',
organismoId: 0,
presentada: false,
adjudicada: false
}
由于表单生成器需要默认值或数组(包含默认值、验证器、异步验证器),因此您需要使用两组括号将数组定义为默认值。
请参阅此处官方 Angular 文档中的示例:
https://angular.io/guide/reactive-forms#validating-form-input
我有一个多select表单控件
<form [formGroup]="form">
<mat-form-field appearance="outline">
<mat-select formControlName="años" multiple placeholder="Años">
<mat-option *ngFor="let year of years" [value]="year">{{year}}</mat-option>
</mat-select>
</mat-form-field>
但我想将实际年份标记为 select,即 2021
export class FiltroOfertasComponent implements OnInit {
private now:Date=new Date();
actualYear:number=this.now.getFullYear();
years:number[]=[this.actualYear-2, this.actualYear-1, this.actualYear];
form: FormGroup;
formularioOriginal = {
años:[this.actualYear],
fechaPresentada: '',
descripcion: '',
organismoId: 0,
presentada: false,
adjudicada: false
}
constructor(private formBuilder: FormBuilder) { }
this.form = this.formBuilder.group(this.formularioOriginal);
但这并没有显示设置原始形式时的默认 selected 值
这都不是
formularioOriginal = {
años:this.actualYear,
fechaPresentada: '',
descripcion: '',
organismoId: 0,
presentada: false,
adjudicada: false
}
这都不是
this.form = this.formBuilder.group(this.formularioOriginal);
this.form.patchValue({
años:this.actualYear
});
是一个multi-select不知道怎么给它传初值
有什么想法吗?
谢谢
您收到以下错误消息:
ERROR
Error: Uncaught (in promise): Error: Value must be an array in multiple-selection mode.
Error: Value must be an array in multiple-selection mode.
有两种方法可以将默认值作为数组传递给 multi-select:
要么在构建表单后修补该值:
this.form.patchValue({
años: [this.actualYear]
});
或者您在表单生成器中设置值,在您的代码中它看起来像这样:
formularioOriginal = {
años:[[this.actualYear]],
fechaPresentada: '',
descripcion: '',
organismoId: 0,
presentada: false,
adjudicada: false
}
由于表单生成器需要默认值或数组(包含默认值、验证器、异步验证器),因此您需要使用两组括号将数组定义为默认值。 请参阅此处官方 Angular 文档中的示例: https://angular.io/guide/reactive-forms#validating-form-input