在Angular中,响应式表单的选择选项与预选默认值适用于简单类型的值,而不适用于复杂类型的对象。如果需要使用对象作为选择选项及预选默认值,可以通过以下方法解决:
ngValue
指令将每个对象作为值传递给option
元素:
export class MyComponent {
selectedOption: any; // 可以根据实际情况修改类型
// 其他代码...
}
export class MyComponent implements OnInit {
myForm: FormGroup;
options: any[] = [
{ label: 'Option 1', value: 'option1' },
{ label: 'Option 2', value: 'option2' },
{ label: 'Option 3', value: 'option3' }
];
ngOnInit() {
this.myForm = new FormGroup({
myControl: new FormControl(this.options[0]) // 设置初始值为第一个选项对象
});
}
// 其他代码...
}
这样,在选择框中选择一个选项时,selectedOption
属性会自动更新为选中的对象。