可以使用指令將內容嵌套到 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>