Angular模板中的可重用片段

前端之家收集整理的这篇文章主要介绍了Angular模板中的可重用片段前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我们现在可以使用其他代码段,指的是< ng-template>:

<div *ngIf="condition; else not">
  Condition satisfied.
  <ng-template #not>
    Condition not satisfied.
  </ng-template>
</div>

我希望能够在* ngIf的上下文之外引用片段 – 类似于

<div>DIV1 <ng-template-call template="shared"></ng-template-call></div>
<div>DIV2 <ng-template-call template="shared"></ng-template-call></div>

<ng-template #shared>This is a shared snippet.</ng-template>

写上我所谓的ng-template-call的正确方法是什么?

是的,我知道我可以把它变成一个单独的组件,但它没有达到那个水平.我总是可以写:

<div *ngIf="false; else shared">

但这看起来很笨拙.

解决方法

我认为Transclusions正是您所寻找的

这是一个示例:

<ng-container [ngTemplateOutlet]="reusable"></ng-container>

<ng-template #resusable>...</ng-template>

供参考:https://toddmotto.com/transclusion-in-angular-2-with-ng-content

猜你在找的Angularjs相关文章