从 Reactive Forms Angular 的输入字段获取更新的值

Question

嗨，我有与数据绑定的反应式表单。我需要在提交后更新表单，我应该得到我更改的值。

html代码：

   <form [formGroup]="editForm" (ngSubmit)="formEdited()">
                   <mat-form-field>
                       <mat-label>Student ID</mat-label>
                         <input type="text"  id="studentID" class="ndi-input" 
                           required formControlName="studentID" autocomplete="off"
                                name="studentID" matInput matInput-warning>
                     </mat-form-field>
                     <mat-form-field>
                          <mat-label>Class ID</mat-label>
                           <input type="text"  id="classID" required 
                                  formControlName="classID" autocomplete="off"
                                name="classID" matInput matInput-warning>
                      </mat-form-field>
        <form>

ts 代码：

   this.editForm.patchValue({
          studentID: "test",
          classID: "demo"
   )}
  formEdited(){
     this.editForm.value;
   }

我怎样才能一次在表单中更新值，而不是获得单个单个控件值。

Answer 1

建议将 formGroup 与反应形式一起使用。 希望这可以帮助

<form [formGroup]="formGroup">

    <mat-form-field class="form-element">
      <input matInput placeholder="Part Number" formControlName="partNumber">
</form>
// you can use ngAfterViewInit() to test that it sets the value
YourMethodToSetValue(){
    console.log(this.formGroup.controls)
    this.formGroup.controls.partNumber.setValue('YOUR VALUE HERE...')
    /* this.formGroup.controls.partNumber.setValue(this.formGroup.controls.partNumber.value);
    console.log(this.formGroup.controls.partNumber.value)*/
}
ngOnInit() {
  this.formGroup = this.formBuilder.group({
      'partNumber': 'default',
  });
}