javascript - 反应式表单正确地将表单值转换为模型对象作为列表

Question

我正在尝试将提交的表单转换为对象。

我一直在使用以下帖子进行指导。

反应式表单正确地将表单值转换为模型对象

但是，该示例仅适用于单个对象，而不适用于对象列表。

我有一个Person对象。

个人.ts

export class Person {
    public constructor(init?: Partial<Person>) {
      Object.assign(this, init);
    }
    x: number;
    y: number;
    personId: number;
    firstName: string;
    lastName: string;
    email: string;
    companyName: string;
    staffCode: string;
  }

在这里我提交表单，并尝试将其转换为Person对象。

批准-edit.component.ts

  public onSubmit(): void {
    const data: any = this.approvalEditFormGroup.value;
    console.log(data);
    this.person = new Person(this.approvalEditFormGroup.value);
    console.log(this.person);
  }

结果：

问题

如何将 转换为( )this.approvalEditFormGroup.value的列表？PersonPerson[]

persons: Person[] = convert(this.approvalEditFormGroup.value);

标签： javascriptangular

Answer 1

您只需要映射表单值并在表单值中的每个项目上创建 Person 类的新实例，如下所示

const data: any = this.approvalEditFormGroup.value;

persons: Person[] = Object.keys(data).map(key => new Person(data[key]));