Eu tenho uma componente de caixa de diálogo que mostra quando eu clico em um botão 'Editar' ao lado de um item em uma tabela. O componente de caixa de diálogo parecido com este de agora:
<h1 mat-dialog-title>{{item.ID}}</h1>
<div mat-dialog-content>
<p>Edit item</p>
<mat-form-field appearance="outline" style="justify-content: center;">
<mat-label>ID</mat-label>
<input matInput [(ngModel)]="item.ID">
</mat-form-field>
<mat-form-field appearance="outline">
<mat-label>Name</mat-label>
<input matInput [(ngModel)]="item.Name">
</mat-form-field>
<mat-form-field appearance="outline">
<mat-label>Date</mat-label>
<input matInput [(ngModel)]="item.Date">
</mat-form-field>
</div>
<div mat-dialog-actions style="justify-content: center;">
<button mat-button (click)="onNoClick()">Cancel</button>
<button mat-button [mat-dialog-close]="item.ID" cdkFocusInitial>Save</button>
</div>
Este parece e funciona bem, e serve o seu propósito. Mas agora eu tenho várias outras tabelas com tipos de dados diferentes, e embora eu possa criar uma janela de diálogo separada para cada tabela e adicionar os campos do formulário manualmente para cada tipo, eu gostaria de ter uma solução mais flexível.
Como posso criar uma caixa de diálogo onde os campos de formulário são adicionados com base no elemento de referência do tipo? E. g: Se eu tenho um objeto do tipo 'Fruta' em uma tabela com properites como 'Nome', 'Color', 'Preço', e um objeto do tipo "Carro" com propriedades como 'Nome', 'Fabricação', 'Potência', posso usar o mesmo componente de caixa de diálogo e criar o formulário dinamicamente?