angular - Angular 反应式表单通过按钮点击提交

Question

我需要使用单击的另一个按钮而不是提交按钮来提交 Angular 反应式表单。

<form [formGroup]="productForm" (submit)="updateProduct($event)" novalidate>
    <mat-form-field appearance="outline" class="col-lg-4 col-md-6 col-sm-12">
    <mat-label>Product Name</mat-label>
    <input matInput placeholder="Product Name" aria-label="Product Name" formControlName="Name" maxlength="70" required>
     </mat-form-field>
</form>

<button class="btn btn-md btn-primary text-upper" type="button">Save</button>

我没有提交按钮，我需要点击保存按钮，然后表单将被提交并且productForm.value也将被获取。

标签： angularangular-reactive-forms

Answer 1

试试这个 template.html

<button class="btn btn-md btn-primary text-upper" type="button" (click)="updateProduct()">Save</button>

组件.ts

updateProduct() {
 console.log(this.productForm.value);
}