Angular / AngularDart是否允许组件显示任意子组件？

Question

我正在构建日历组件，我想向用户提供以下API：

<fancy-calendar>
    <my-custom-day [day]="day"></my-custom-day>
</fancy-calendar>

fancy-calendar负责跟踪用户选择的当前月份。在内部，我想使用* ngFor：

<div *ngFor="let day of daysInMonth">
    <ng-content [day]="day"></ng-content>
</div>

这似乎不起作用，因为ng-content无法发送任意值（在本例中为当天）。

是否需要为此编写自定义指令？我如何使用户能够连续几天使用自己的组件？

Answer 1

您可以通过使用动态组件加载来执行此操作。 https://github.com/dart-lang/angular/blob/7f6858bc48c1d2a454a4bc350077d67c277c6516/doc/faq/component-loading.md

我在Angular dynamic tabs with user-click chosen components

中回答了关于TS的类似问题

与*ngFor一起使用的最简单方法是构建一个帮助程序组件，该组件将您想要创建的组件的类型或工厂传递给该帮助程序组件。

另一种方法是使用https://webdev.dartlang.org/api/angular/angular/NgTemplateOutlet-class 用户将内容作为模板传递的地方

<fancy-calendar>
    <ng-template> 
      <my-custom-day [day]="day"></my-custom-day>
    </ng-template>
</fancy-calendar>

和fancy-calender使用NgTemplateOutlet进行渲染。 借助*ngFor https://webdev.dartlang.org/api/angular/angular/NgFor/ngForTemplate，也可以多次渲染同一模板。