我在将表单组数据传递到saveDialog（）函数时遇到问题，该函数在提交按钮上更新表单数据。
我将如何在Angular 7中做到这一点？我正在尝试将每个表单组的所有组件分开，并使用一个按钮一起提交/更新？
Modify-view-action.component.html
<form [formGroup]="modifyActionForm" (ngSubmit)="saveDialog()">
<div class="container" fxLayout="row" fxLayoutGap="25px">
<div class="column1" fxLayout="column">
<mat-form-field>
<mat-label>Name</mat-label>
<input matInput>
<mat-icon matSuffix>sentiment_very_satisfied</mat-icon>
</mat-form-field>
<mat-form-field>
<mat-label>Keyword</mat-label>
<input matInput>
<mat-icon matSuffix>sentiment_very_satisfied</mat-icon>
</mat-form-field>
<mat-form-field>
<mat-label>Description</mat-label>
<input matInput>
<mat-icon matSuffix>sentiment_very_satisfied</mat-icon>
</mat-form-field>
<mat-form-field>
<mat-label>Icon</mat-label>
<input matInput>
<mat-icon matSuffix>sentiment_very_satisfied</mat-icon>
</mat-form-field>
<mat-form-field>
<mat-label>Priority</mat-label>
<input matInput>
<mat-icon matSuffix>sentiment_very_satisfied</mat-icon>
</mat-form-field>
</div>
</form>
Modify-view-action.component.ts
export class ModifyViewActionComponent implements OnInit {
modifyActionForm: FormGroup;
dbrAction: any;
constructor() { }
ngOnInit() {
this.initData();
}
initData() {
this.dbrAction = JSON.parse(localStorage.getItem('DbrAction'));
}
}
首先，为了从FormGroup中获取数据，您需要在要从中获取数据的每个输入上添加formControlName。像那样 ：
<mat-form-field>
<mat-label>Name</mat-label>
<input matInput formControlName="name">
<mat-icon matSuffix>sentiment_very_satisfied</mat-icon>
</mat-form-field>
您还需要在.ts文件中声明每个控制器的FormGroup。像那样 ：
modifyActionForm = new FormGroup({
name : new FormControl(),
keyword: new FormControl(),
description: new FormControl(),
// And that ⬆ for each input in your form
})
为了从此FormGroup中获取数据，您需要执行以下操作：
this.modifyActionForm.value
您将获得一个包含输入数据的对象。
您的问题不是很清楚，但是如果您想将FormGroup之类的数据从一个组件传递到另一个组件，则存在许多技术。
我建议您阅读Jeff Delaney的这篇精彩文章，其中介绍了在Angular组件之间共享数据的不同方式（Fireship.io-Angular组件之间共享数据）和另一本Fireship.io-Angular反应性表单基础指南，介绍了如何工作反应性表单和如何使用它们。
美好的一天 ！
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句