Angular-如何在手动嵌套的组件中重用数据

Question

我有两个Angular组件checklist-page和checklist。 checklist-page从后端下载数据

我想在checklist组件中多次使用checklist-page组件。

我想在checklist-page个组件中使用checklist的下载数据。

转折点是，我无法选择基本的父子组件嵌套方式，因为我想以此方式自定义每个checklist实例的参数：

<checklist-page [type]='locations'>
   <checklist [checklistData]="parentComponentData" [filter]='visited'>
   <checklist [checklistData]="parentComponentData" [filter]='remaining'>
   <checklist [checklistData]="parentComponentData" [filter]='visited' [userId]=123>
   <checklist [checklistData]="parentComponentData" [filter]='visited' [userId]=234>
   <checklist [checklistData]="parentComponentData" [filter]='remaining' [userId]=456>
   <checklist [checklistData]="parentComponentData" [filter]='remaining' [userId]=456>
   .
   .
   .
</checklist-page>

因此，简而言之，我不确定checklist-page模板的内容是什么，它可能会有所不同。

在这种情况下如何将数据从checklist-page传递到checklist？

Answer 1

您可以使用此链接中的一种方法。我更喜欢一种服务 https://angularfirebase.com/lessons/sharing-data-between-angular-components-four-methods/

Answer 2

您可以使用动态组件加载程序https://angular.io/guide/dynamic-component-loader。