我试图建立一个Angular Reactive表单,其中一个帐户可以添加许多学生。
该表格似乎有效。当您点击添加学生时,它会创建一个新学生,但您会在控制台上看到提示
错误错误:找不到路径为'studentsArray-> 1-> firstName的控件
以此类推。
app.component.html
<form [formGroup]="accountForm">
<div>
<input formControlName="firstName" placeholder="First name">
</div>
<div>
<input formControlName="lastName" placeholder="Last name">
</div>
<div>
<input formControlName="phone" placeholder="Phone">
</div>
<div>
<input formControlName="email" placeholder="Email">
</div>
<button (click)="addStudent()" *ngIf="!showStudentForm">Add Student</button>
<div formArrayName="studentsArray">
<div *ngFor="let student of studentsArray.controls; let i = index" [formGroupName]="i">
<input formControlName="firstName" placeholder="First Name">
<input formControlName="lastName" placeholder="Last Name">
<input formControlName="dob" placeholder="Date of Birth">
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
app.component.ts
import { Component, Input, OnChanges } from '@angular/core';
import { FormGroup, FormControl, Validators, FormArray, FormBuilder } …Run Code Online (Sandbox Code Playgroud)