angular 6 returns 个空值中的反应形式

Question

我在 angular 6 中使用 ng2-archwizard

中的反应形式

我检查了所有步骤，但整个对象都填充了空值

json Object returned from formGroup

我该怎么办？！我已经将反应式表单模块导入父模块和 formGroup，将 FormControl 导入组件 ts 文件..

Answer 1

为了在 Angular 中使用响应式表单，您需要首先将适当的模块导入到您的目标 module.ts 文件中。例如：app.module.ts 这样：

@NgModule({
 declarations: [
  AppComponent
  .
  .],
 imports:[
  .
  .
  ReactiveFormsModule],
 entryComponents:[..],
 providers: []
 ....

然后你的目标组件some.component.ts应该看起来像这样：

myForm = this.fb.group({
 field1:['',[Validators.required,...]],
 field2: ....
)};

constructor(private fb: FormBuilder, ...){}

然后在您的 html 文件 some.component.html 文件中，您只需像这样显示您的表格：

<form [formGroup]="myForm" (ngSubmit)="yourSubmitFunction(myForm)">
 <div>
  <input formControlName="field1" >
 </div>
 .
 .
 .
 <button type="submit">Submit</button>
</form>

希望对您有所帮助！

angular 6 returns 个空值中的反应形式

Reactive forms in angular 6 returns null values

angular

angular-reactive-forms

angular-forms