我什么时候才真正在 angular 中使用 ng-template 2+

Question

我想知道使用 ng-template 的理想情况是什么。我有以下情况。代码如下

<div *ngIf="somecond">html inside1</div>
<div *ngIf="somecond1">html inside2</div>
<div *ngIf="somecond2">html inside3</div>

其他开发者修改如下

<ng-template #text1>html inside1</ng-template>
<ng-template #text2>html inside2</ng-template>
<ng-template #text3>html inside3</ng-template>

<div *ngIf="somecond;then text1"></div>
<div *ngIf="somecond1;then text2"></div>
<div *ngIf="somecond2;then text3"></div>

高于使用 ng-template 的正确方法，或者在这种情况下使用普通代码会更好。我什么时候才真正使用ng-template

Answer 1

ng-template 的理想情况是当您想使用 else 语句时。

而不是：

<div *ngIf="isDisplayed">Item 1</div>
<div *ngIf="!isDisplayed">Item 2</div>

你可以这样做：

<div *ngIf="isDisplayed; else showItem2">Item 1</div>

<ng-template #showItem2>
Item 2
</ng-template>

Answer 2

ng-template 有几个（不太常见的）用例。它的内容未显示，您可以使用 angular dom 局部变量将其发送到指令或组件的输入，以便它们按需要显示。

*ngIf、*ngFor 或 *ngSwitch 实际上在后台使用它，星号版本只是一个别名。

正如@TheUnreal 所说，其主要用例之一是显示加载的其他语句：

<ng-template #loading>loading...</ng-template>
<div *ngIf="data; else loading">
   Content
</div>

虽然您的示例可能不是使用它的理想方式，因为它只会导致您的模板复杂化。

我什么时候才真正在 angular 中使用 ng-template 2+

When do i really use ng-template in angular 2+

ng-template

angular