Question

我有一个包含3个字段的反应形式，其中两个字段具有默认值，并且该字段对用户禁用。用户必须输入第三字段的值并提交表格。提交后，我只获得用户在form.value中输入的值

  constructor(private fb: FormBuilder, private userService: UserService) { 
    this.signUpForm = fb.group({
      'name': ['John Doe', Validators.required],
      'email': ['john@requantive.com', Validators.required],
      'phone': [null, Validators.required]
    });
  }

当我在ngsubmit方法上控制台记录form.value时，我得到的输出为

{电话：“ 123456”} 电话：“ 123456” 原始：对象

Answer 1

如果要使用禁用方法禁用Formcontrol，请使用getRawValue（）方法获取所有值，包括禁用控件

app.component.ts

  this.signUpForm = fb.group({
      'name': [{value:'John Doe', disabled:true}, Validators.required],
      'email': [ {value:'john@requantive.com', disabled:true}, Validators.required],
      'phone': [null, Validators.required]
    });

app.component.html

<form [formGroup]="signUpForm">
  <input formControlName="name">
  <input formControlName="email">
  <input formControlName="phone">
</form>
formValue:{{signUpForm.getRawValue() | json}}

ForMoreInfo

Example Stackblitz

如何在ngsubmit方法中获取预填写的表单字段值？

1 个答案: