I am working with a component that has the selector 'app-view', and I need to replace a specific part of the template:
<div>
content
</div>
The part that needs to be replaced will be substituted with another component:
selector: 'app-item',
This replacement should happen when the following button is triggered:
<a [routerLink]="['../', dossier.id, 'item', 'new', itemTypes.Goal]"
><mat-icon class="add_box">add</mat-icon>
What is the best approach for achieving this?
Thank you
Below is the current component structure:
... (existing component code goes here) ...
The specific part that needs replacement is as follows:
... (part to be replaced goes here) ...
The new component that will replace the above section is described below:
<mat-card>
... (new component details go here) ...
</mat-card>
<ng-template #itemForm let-formGroup="formGroup" let-globalErrors="globalErrors">
... (item form details go here) ...
</ng-template>