0

I am trying to use ng-template for a html which is a separate component ,and I am trying to use its reference in other html.. Is it possible? If so I have tried the below ways and would like to understand what is that I am going wrong with?

ng-template.html

<ng-template #sample1>  
  <p>ng template content</p>
</ng-template>

display-template.html

<div *ngIf="found;">
  <ng-container *ngTemplateOutlet="sample1"></ng-container>
</div>

DisplayTemplateComponent.ts

export class DisplayTemplateComponent   {
    @ViewChild('sample1', {static: false}) sample1: ElementRef;
    found = true;
}
Armen Stepanyan
  • 1,618
  • 13
  • 29
curious coder
  • 101
  • 6
  • Does this answer your question? [How to load the ng-template in separate file?](https://stackoverflow.com/questions/53645174/how-to-load-the-ng-template-in-separate-file) – A.Casanova Mar 17 '23 at 12:18

1 Answers1

1

I think you should use a regular angular component instead of an ng-template if you want to use it globaly in your application.

I am not sure why you want to do it this way. Anyways this link may help you How to load the ng-template in separate file?.

Fahd Lihidheb
  • 671
  • 4
  • 20