I have a main grid component that includes smaller grid-item components. The majority of these grid items navigate to a specific route when clicked. However, there is one particular item that should open a modal window instead of navigating.
Is there a way for me to provide this specific child component with a reference to the template #deactivateDialog
?
Currently, I am using @Input route
, which sends it as a string, but I actually need to pass the template itself.
Main Grid:
<app-grid-item route="deactivateDialog" (navigationType)="openDialog($event)"></app-grid-item>
//more app-grid-items
<ng-template #deactivateDialog>
//dialog markup
</ng-template>
openDialog(dialog) {
//opening dialog
}
Child Component:
<div (click)="navigate()">
@Input() route;
@Output() navigationType = new EventEmitter();
navigate() {
this.navigationType.emit(this.route);
}