使用模型数据提交表单时的角度重定向答案

【问题标题】：Angular re-direct via form submission with model data使用模型数据提交表单时的角度重定向
【发布时间】：2019-12-25 21:08:48
【问题描述】：

我必须在 Ionic/Angular 应用程序中实现 3D 安全支付。应用程序需要对我们的服务器进行 API 调用，并在返回时需要将用户重定向到第 3 方网站 (pay360)。

要执行重定向，我需要创建一个包含三个值的表单并以编程方式提交。如果我用一些我知道有效的值对表单进行硬编码，那么一切正常，并且重定向到 Pay360 也很好：

<form #myForm action="https://dev.mite.pay360.com/acs" method="POST">
        <input name="MD" value="abc" />
        <input name="TermUrl" value="def" />
        <input name="PaReq" value="hij" />
</form>

但是，如果我尝试使用这样的数据绑定将数据插入到表单中：

<form #myForm action="https://dev.mite.pay360.com/acs" method='POST'>
        <input [(ngModel)]="myModel.MD" name="MD"/>
        <input [(ngModel)]="myModel.TermUrl" name="TermUrl"/>
        <input [(ngModel)]="myModel.PaReq" name="PaReq" />
</form>

即使在组件中插入的值与我在对上述表单进行硬编码时使用的值完全相同，它也不起作用，例如

this.myModel.TermUrl = "abc"
this.myModel.MD = "def";
this.myModel.PaReq = "hij";
this.myForm.nativeElement.submit()

在重定向发生之前，这些值在屏幕上看起来都很好，所以我知道它们正在被填充。

但当 Pay360 页面出现时，出现数据验证错误。

那么为什么我的硬编码表单重定向成功而我的模型绑定表单失败了？

【问题讨论】：

标签： angular forms ionic-framework redirect data-binding

【解决方案1】：

我发现如果我在调用 submit 方法之前设置了一个短暂的延迟，这会奏效 - 所以我猜 from 是在没有值的情况下提交的，即使它们是首先填充的。

【讨论】：