I use ng-bootstrap to create Popover with HTML and bindings. ng-template will always be recreate at time I click botton and my component need sometime to initialize so I should hide it instead. How could I hide ng-template?
ps. I'm not native english, pardon me if I confuse you.
I have try using ng-container but ngbPopover seem only accept ng-template
<button type="button" class="card tools-toc btn btn-outline-primary"
#popover="ngbPopover" [ngbPopover]="popLegend" [ngClass]="{'active': popover.isOpen()}"
placement="top" [autoClose]="false" popoverClass="popover-legend" (click)="toggleToc()">
<i class="fas fa-layer-group"></i>
</button>
<ng-template #popLegend>
<div>
<div class="legend-title">ชั้นข้อมูล</div>
<div >
<app-core-toc [config]="_configService[1]" [omElec]="true">
</app-core-toc>
<app-core-toc [config]="_configService[0]" [omWork]="true">
</app-core-toc>
</div>
</div>
</ng-template>
I expect to create app-core-toc on init. When I click button my template is just hide or show.