Angular2：嵌套表单组

Question

我已创建此表单：

<div ng-repeat="b in books">
    {{b.title}}
    <img ng-src="{{b.imgUrl}}"
    ...
</div> 

如您所见，我创建了一个名为<h1>First book</h1> {{books[0].title}} <img ng-src="{{books[0].imgUrl}}"/> 的嵌套表单组。进入我的模板：

this.cardForm = this.fb.group({
    number: ['', Validators.compose([Validators.required, this.validateCardNumber])],
    holderName: ['', Validators.required],
    expiry: this.fb.group({
      expirationMonth: ['', Validators.required],
      expirationYear: ['', Validators.required],
    }),

我收到此错误：

expiry

有什么想法吗？

Answer 1

在您的组件方设置this.cardForm之前，您的视图已加载。

尝试放*ngIf：

<form *ngIf="cardForm" [formGroup]="cardForm" novalidate="novalidate" (ngSubmit)="onSave()">

或尝试使用*ngIf封装div：

  <div *ngIf="cardForm">
    <form [formGroup]="cardForm" novalidate="novalidate" (ngSubmit)="onSave()">

    </form>
   </div>