ngSubmit 不会在移动浏览器上提交答案

【问题标题】：ngSubmit won't submit on mobile browserngSubmit 不会在移动浏览器上提交
【发布时间】：2019-06-29 07:00:23
【问题描述】：

当触摸（点击）按钮时没有任何反应！

在使用 Chrome 或 Firefox 等浏览器的 Windows 10 桌面上完美运行，但不适用于三星 Galaxy Note 4(android 6) 或三星 Galaxy Tab S3 (android 8) 等设备。

这是我的代码..

<form fxLayout="column" fxLayoutAlign="center" [formGroup]="customerForm" (ngSubmit)="saveCustomer(customerForm.value)">
    <label for=""><h3>New Customer</h3></label>
    <mat-form-field>
        <input matInput placeholder="First Name" formControlName="firstName" autocomplete>
    </mat-form-field>
    <mat-form-field>
        <input matInput placeholder="Last Name" formControlName="lastName" autocomplete>
    </mat-form-field>
    <mat-form-field>
        <input matInput placeholder="Email" formControlName="email" autocomplete>
    </mat-form-field>
    <mat-form-field>
        <input matInput placeholder="Telephone" formControlName="telephoneNum" autocomplete>
    </mat-form-field>
    <mat-form-field>
        <input matInput placeholder="Cellular" formControlName="cellularNum" autocomplete>
    </mat-form-field>

    <button type="submit" mat-raised-button color="primary">Submit</button> 
</form>

这是组件上的代码..

saveCustomer(newCustomer: Customer) {
    this.customerService.saveCustomer(newCustomer).subscribe(
        customer => console.log(customer),
        err => console.error(err),
        () => this.router.navigate(["/customers"])
    );
}

其他人也有这个问题？

【问题讨论】：

Made a StackBlitz 对此进行测试，并且表单在移动浏览器上提交得很好。尝试在saveCustomer() 中的订阅前添加console.log() 或alert()，以查看问题是否存在于您的订阅中。

标签： angular-material angular7 angular-flex-layout

【解决方案1】：

您的代码看起来不错，只需替换此行即可：

替换此行

 (ngSubmit)="saveCustomer(customerForm.value)"

用这条线

(submit)="saveCustomer(customerForm.value)"

这是因为 Angular 2+ 使用相同的 JavaScript 函数或 html 元素方法进行单向事件绑定，只需放置 ( 任何 js/Html 事件 )

ex: onclick 可以写成 (click) 在角度。 onblur 可以写成 (blur) 的角度。

如果你得到它，请告诉我。

【讨论】：

【解决方案2】：

如果你尝试使用属性 (click)="" 并删除这个(ngSubmit)="saveCustomer(customerForm.value)"

例如：

<button (click)="saveCustomer(customerForm.value)" 
 type="submit" mat-raised-button color="primary">Submit</button>

【讨论】：