在 ng-template 中访问组件

Question

我在 ng-template 中有一个组件。访问它以调用方法的最佳方式是什么？我目前运行遇到一个问题，即它总是未定义或无法通过我用来访问它的常规方法访问。

<ng-template #template>
<app-planned-expense-edit-form #editform
                               (save)="onPlannedItemSave($event)"
                               (isHidden)="onIsHidden($event)">

</app-planned-expense-edit-form>
</ng-template>

Answer 1

使用，您可以定义仅由 Angular 呈现的模板内容，当您直接或间接明确指示它这样做时，允许您完全控制内容的方式和时间被展示。我建议使用而不是使用，因为可以用来保存指令而无需创建 HTML 元素。

并像这样重写你的代码

<ng-template #template [ngIf]="true">
<app-planned-expense-edit-form #editform
                               (save)="onPlannedItemSave($event)"
                               (isHidden)="onIsHidden($event)">

</app-planned-expense-edit-form>
</ng-template>

如果您想使用带有 { static: true } 配置的 @ViewChild 访问 TS 中的这些元素。引入了 { static: true } 选项以支持动态创建嵌入式视图。

在 ng-template 中访问组件

Access component inside on ng-template

angular

ng-template