Angular 10 NgTemplateOutlet指令

在这篇文章中，我们将看到Angular 10中的NgTemplateOutlet是什么以及如何使用它。

Angular10中的NgTemplateOutlet是用来从准备好的TemplateRef中插入一个嵌入式视图。 NgTemplateOutlet添加了显示在页面上的参考元素。

语法:

<li *NgTemplateOutlet='condition'></li>

NgModule: NgTemplateOutlet使用的模块是。

CommonModule

Selectors:

[NgTemplateOutlet]

步骤:

创建一个要用的angular应用程序。
使用NgIf不需要任何导入。
在app.component.html中，将NgTemplateOutlet指令添加到有其引用的元素中。
使用ng serve为angular应用程序提供服务，以查看输出。

示例 1:

<ng-container *ngTemplateOutlet="gfg"></ng-container>
  
<ng-template #gfg>
    <h1>GeeksforGeeks</h1>
  
    <div>
        ngTemplateOutlet Directive
    </div>
</ng-template>

输出:

Angular 10 NgTemplateOutlet指令

示例 2:

<div *ngTemplateOutlet="gfg"></div>
  
<ng-template #gfg>
    <h1>
        GeeksforGeeks
    </h1>
    <div>
        We can also use ngTemplateOutlet Directive with a div 
    </div>
</ng-template>