Mam składnik dialogu, który jest wyświetlany, gdy naciskam przycisk "Edytuj" obok pozycji w tabeli. W tym momencie składnik dialogu wygląda w następujący sposób:
<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>
Wygląda i działa normalnie, i służy swoim celom. Ale teraz mam kilka innych tabel z różnymi typami danych, i, choć mogę utworzyć osobne okno dialogowe dla każdej tabeli i dodać pola ręcznie dla każdego typu, chciałbym mieć bardziej elastyczne rozwiązanie.
Jak mogę utworzyć okno dialogowe, w którym pola są dodawane w zależności od rodzaju elementu referencyjnego? Na przykład: Jeśli mam obiekt typu "Owoce" w jednej tabeli z właściwościami, takimi jak "Nazwa", "Kolor", "Cena", a obiekt typu "Samochód" z właściwościami, takimi jak "Nazwa", "Produkuje", "Moc", czy mogę użyć jeden i ten sam składnik dialogu i dynamicznie tworzyć formę?