可以使用指令将内容嵌套到 Angular 中的 ng-template 中吗

Question

在我的项目中，我想使用 Directive 将我的代码动态嵌套到 ng-template 中。 Angular有什么办法吗

我有这样的代码

<button> Click Me </button>

如果我使用这样的指令（custDir）

<button custDir> Click Me </button>

Angular 应该像这样呈现

<ng-template>
    <button> Click Me </button>
</ng-template>

有什么办法可以做到这一点？

Answer 1

要访问按钮文本，您需要使用 ng-content

在您的指令中：

<ng-template>
    <button> <ng-content></ng-content><!--This will get replaced with "Click Me" -->  </button>
</ng-template>