Angular 中的组件可重用问题

Question

我对角度可重用组件不熟悉，并且不确定如何在构建组件后重用该组件。我有 3 个组件父组件、容器组件和可重用组件。

父组件.ts

reUsableContent: any;

ngOnInit(): void {
        this.reUsableContent = ReUsableContentComponent;
}

parent.component.html

<app-container [reUsableContent]="ReUsableContentComponent"></app-container>

容器.component.html

<ng-container *ngTemplateOutlet="reUsableContent"></ng-container>

容器.组件.ts

@Input() reUsableContent: TemplateRef<any>;   

可重用.component.html

<ng-template #reUsableContent>
    <p>Reusable content works!</p>
</ng-template>

我不确定这是否是制作可重用组件的方法。上面的方法不起作用。上面缺少什么？

Answer 1

TemplateRef

与

ReUsableContentComponent

不同

我认为您需要熟悉这一点：https://marketsplash.com/tutorials/typescript/typescript-how-to-create-a-templaterref-object/