CODEWITHSUNDEEP
angular
Suresh Nagar
Suresh Nagar

Reputation: 1199

Why NgTemplateOutlet directive on the ng-template prints contents on page?

I can understand why <1> works, but surprisingly <2> also works and prints the contents on the page, why? Shouldn't the <2> just create another ng-template which has to be used by either createEmbeddedView or ngTemplateOutlet etc?

<!-- 1 -->
<ng-container *ngTemplateOutlet="contents"></ng-container>
<!-- 2 -->
<ng-template *ngTemplateOutlet="contents"></ng-template>


<ng-template #contents>These are contents</ng-template>

Upvotes: 3

Views: 147

Answers (1)

mahalde
mahalde

Reputation: 709

ngTemplateOutletinserts an embedded view in the HTML node. The original node (here the ng-container or the ng-template) doesn't get displayed in the DOM at all.

For example you can also write

<div *ngTemplateOutlet="contents">Hello World!</div>

<ng-template #contents>These are contents</ng-template>

In this example the original div is not inserted into the DOM at all, but rather the <ng-template #contents>.

Upvotes: 2

Related Questions