小编JR9*_*R90的帖子

我是Angular 2的新手,并决定学习最好的方法是通过Angular官方指南.

我浏览了反应表单指南 https://angular.io/guide/reactive-forms

演示链接:https://stackblitz.com/angular/jammvmbrpxle

虽然内容总体来说非常好,但我仍然坚持如何实现更复杂的表单.在给定的示例中,每个Hero都有可能存在许多地址.地址本身就是一个扁平的对象.

如果地址有其他信息,例如位于地址的房间的颜色和类型,该怎么办？

export class Address {
    street = '';
    city   = '';
    state  = '';
    zip    = '';
    rooms = Room[];
}

export class Room {
     type = '';
}

这样表单模型看起来像这样......

createForm() {
this.heroForm = this.fb.group({
  name: '',
  secretLairs: this.fb.array([
      this.fb.group({
          street: '',
          city: '',
          state: '',
          zip: '',
          rooms: this.fb.array([
              this.fb.group({
                 type: ''
          })]),
      })]),
  power: '',
  sidekick: ''
});

}

编辑 - 与ngOnChanges一起使用的最终代码

英雄detail.component.ts

createForm() {
    this.heroForm = this.fb.group({
      name: …