Well, this is my parent component where I am trying to pass the template nodeTemplate
to the child ils-tree
<div class="nodes-panel">
<ils-tree layout="horizontal" [json]="nodes" [template]="nodeTemplate">
</ils-tree>
</div>
<ng-template #nodeTemplate>
<ng-template let-node pTemplate="default">
<p class="node-type"></p>
<p class="node-name"></p>
</ng-template>
<ng-template let-node pTemplate="orgNode">
<p class="org-node-name"></p>
</ng-template>
</ng-template>
The child component ils-tree
's HTML looks this way
<p-tree
[value]="nodes"
[layout]="layout"
selectionMode="single"
[(selection)]="selectedNode"
[loading]="loading"
>
<ng-container *ngTemplateOutlet="template"></ng-container>
</p-tree>
and the controller file has
@Input()
template: TemplateRef<any>;
Basically, the p
s are nowhere to be seen and yes, the data json
is being passed successfully. Help!
P.S The template when embedded directly, in between, works. That is,
<p-tree
[value]="nodes"
[layout]="layout"
selectionMode="single"
[(selection)]="selectedNode"
[loading]="loading"
>
<ng-template let-node pTemplate="default">
<p class="node-type"></p>
<p class="node-name"></p>
</ng-template>
<ng-template let-node pTemplate="orgNode">
<p class="org-node-name"></p>
</ng-template>
</p-tree>
Thanks.
from Angular 6 - Child doesn't render template passed by parent
No comments:
Post a Comment