动态形式的异步绑定

Question

基于creating dynamic forms上的Angular指南，我已经设置了一堆可以动态创建表单的类。这很有效，但如果我不能仅仅在模型对象上动态地建立表单，那么它实际上不会仅仅是编写html而节省很多精力。

所以我创建了一个服务，它根据模型对象中的属性动态构建表单。

问题 - 模型对象是异步从Web服务返回的。因此Angular在进行初始绑定时会爆炸。

<dynamic-form [formConfig]="formConfig"></dynamic-form>

我已尝试将formConfig设为Promise或Observable并将此调用更改为：

<dynamic-form [formConfig]="formConfig | async"></dynamic-form>

但由于undefined被传递到<dynamic-form>，它仍在尝试立即绑定并炸毁。

我认为问题在于async管道似乎无法正常工作，因为我期望在我的自定义组件上使用。

有什么建议吗？

Answer 1

无论出于何种原因，async管道似乎无法与用户编写的组件一起正常工作。我发现用*ngIf来保护整个问题可以解决问题。

<div *ngIf="formConfig | async; let formConfig">
    <dynamic-form [formConfig]="formConfig"></dynamic-form>
</div>