如何使用预选值初始化下拉菜单？

因此，我第一次使用Angular 8（如果这不是菜鸟问题，很抱歉）为.Net Core后端创建UI，并且我有此对象

{
"tipoId": 1,"name": "Jato D'Agua","operations": [
{
"operationId": 3,"name": "Desapertar","descricao": "Serve para desapertar parafusos","duracao": 5
},{
"operationId": 5,"name": "Apertar","descricao": "Serve para apertar parafusos","duracao": 5
}
]
}


我的机器类型声明如下：

export class TypeMachine {
tipoId?: number;
name: string;
listOperation: Operation[];
}


由于用户可以使用多重选择（Here）修改操作列表，因此我已经可以显示所有可用的操作，但是我不知道如何使用其中的操作进行预选择对象TypeMachine。

我的HTML：


Operacoes


{{operacao.name}}




我的component.ts看起来像这样

export class TipomaquinaAddEditComponent implements OnInit {
operacoes$: Observable;
form: FormGroup;
actionType: string;
formName: string;
formArray: Operation[];
tipoId: number;
errorMessage: any;
existingTipo: TipoMaquina;
constructor(
private tipomaquinaService: TipomaquinaService,private formBuilder: FormBuilder,private avRoute: activatedRoute,private router: Router,private operacaoService: OperacaoService
) {
const idParam = 'id';
this.actiOnType= 'Add';
this.formName = 'name';
this.formArrayIds = number [];
if (this.avRoute.snapshot.params[idParam]) {
this.tipoId = this.avRoute.snapshot.params[idParam];
}
}
ngOnInit() {
if (this.tipoId > 0) {
this.actiOnType= 'Edit';
this.loadOperacoes();
this.tipomaquinaService.getTipoMaquina(this.tipoId)
.subscribe(
data => (
(this.existingTipo = data),this.form.controls[this.formName].setvalue(data.name)
)
);
}
}
save() {
if (!this.form.valid) {
return;
}
// if (this.actiOnType=== 'Add') {
// const tipo: TipoMaquina = {
// name: this.form.get(this.formName).value,// listOperacaoId: Array[]
// };
// this.tipomaquinaService.saveTipoMaquina(tipo).subscribe(data => {
// this.router.navigate(['/tipomaquina',data.tipoId]);
// this.router.navigate(['/tiposmaquina']);
// });
// }
if (this.actiOnType=== 'Edit') {
const tipo: TipoMaquina = {
tipoId: this.existingTipo.tipoId,name: this.form.get(this.formName).value,listOperacao: this.form.get('operacoes').value
};
this.tipomaquinaService
.updateTipoMaquina(tipo.tipoId,tipo)
.subscribe(data => {
this.router.navigate([this.router.url]);
this.router.navigate(['/tiposmaquina']);
});
}
}
cancel() {
this.router.navigate(['/tiposmaquina']);
}
get name() {
return this.form.get(this.formName);
}
get operacoes() {
return this.form.get('operacoes') as FormArray;
}
loadOperacoes() {
this.operacoes$ = this.operacaoService.getOperacoes();
}
}


做一个总结，我需要实现的是：

• 预选择多重选择器的条目


• 在用户保存更改后检索选定的条目。

我可以吗？

提前谢谢！


Select an option

None
Option 1
Option 2
Option 3




mat-select控件具有一个名为value的输入属性。创建一个名为selected的属性。如果使用的是FormControl，则需要在FormControl定义中绑定所选字段。然后，您可以使用formcontrol的setValue从代码进行设置。