在 angular x (2 4 5) 中创建一个表单并提交它的最佳方法是什么? [英] What would be the best way to create a form onthe Fly in angular x (2 4 5) and submit it?
本文介绍了在 angular x (2 4 5) 中创建一个表单并提交它的最佳方法是什么?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有一个 angular x(2 4 5) 应用程序,我必须将帖子重定向到银行页面,以便用户可以支付一些费用.所以,我想在我的 DOM 中动态创建一个表单并发布它.找不到最好的方法.循环创建表单很容易,但绘制完成后直接发布就不容易了.
I have an angular x(2 4 5) app, and i must make a post redirect to a bank page, so the user can pay something. So, I want to create a form on the fly in my DOM and post it. Can't find the best way. It's easy to loop and create a form, but not easy to directly post it after drawing it.
提前致谢
推荐答案
您可以使用带有隐藏字段和 ViewChild 的表单来获取表单的引用,例如
You can use a form with the fields hidden and ViewChild to get the reference of the form, e.g.
@Component({
selector: 'my-app',
template: `
<button (click)="sendData()">send</button>
<form #externalForm method="post" action="http://url-comerce" target="_blank">
<input type="hidden" id="data1" name="data1" [ngModel]="comerceData.data1">
<input type="hidden" id="data2" name="data2" [ngModel]="comerceData.data2" >
</form>
`,
})
export class HomeComponent {
comerceData:any={}
@ViewChild('externalForm') externalForm: ElementRef;
constructor() { }
sendData() {
//fill the data to send
this.comerceData={
data1:"something",
data2:"something more"
}
//Use a setTimeout. if not, the change of the data are not send
setTimeout(()=>{
this.externalForm.nativeElement.submit()
}, 0);
}
}
这篇关于在 angular x (2 4 5) 中创建一个表单并提交它的最佳方法是什么?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文