Angular 2发布表单到外部链接

编程入门 行业动态 更新时间:2024-10-28 10:34:38
本文介绍了Angular 2发布表单到外部链接的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧! 问题描述

我是Angular 2的新手.这似乎很饿,但是我需要将 form 发送到外部链接,此外,我需要在发布请求后将用户重定向到此页面...

I am new in Angular 2. It seems to be starnge, but I need to send form to external link, moreover, I need to redirect user to this page after post request...

<form id="Form" method="post" action="http//somelink" target="TheWindow"> <input type="hidden" name="linkname" value="someValue" /> </form>

在我像这样通过JQuery发出请求之前,

Before I made that request by JQuery like that:

<script> $( document ).ready(function() { $( ".btnUpgrade" ).on( "click", function(){ window.open('', 'TheWindow'); document.getElementById('Form').submit(); }); }); </script>

但是现在我陷入困境,不知道如何在Angular 2中做到这一点.我读了很多主题,但是他们很无助.我尝试了 window.location.href ='...'; ,但这仅对获取请求有效,而对发布则毫无用处.任何帮助表示赞赏.

But now I'm stuck and no idea how to do that in Angular 2. I read a lot of topics but they been helpless. I tried window.location.href = '...'; but it's good only for Get request and useless for post. Any help appreciated.

更新我尝试过的(在服务中):

UPDATE What I tried(in Service):

submitHiddenForm() { var headers = new Headers(); headers = this._httpClient.createCustomHeader(); var url = 'http//somelink'; var body = 'linkname=someValue'; return this.http.post(url, body, headers).map(this.extractData).catch(this.handleError); }

在组件中:

submitHiddenForm() { this._upgradeService.submitHiddenForm().subscribe (data => { window.location.href = 'somelink'; }, error => {console.log('Error while redirecting!'); }); }

我有错误:

XMLHttpRequest cannot load somelink. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'localhost:8080' is therefore not allowed access.

在我的POST请求中,我有这样的标头:

In my POST request I have such Headers:

createCustomHeader(): Headers { var headers = new Headers(); headers.append('Access-Control-Allow-Origin', '*'); headers.append('Access-Control-Allow-Headers', 'origin, x-requested-with, x-http-method-override, content-type'); headers.append('Access-Control-Allow-Methods', 'POST'); headers.append('Access-Control-Allow-Credentials', 'true'); return headers; }

推荐答案

请根据发布请求的状态码进行尝试

try this on the basis of status code of post request

this.http.request(new Request(this.requestoptions)) .subscribe(res => { if (res[0].status == 201) { this.router.navigateByUrl('..URL here..'); } console.log(res[0].json); }, err => { console.log(err); })

更多推荐

Angular 2发布表单到外部链接

本文发布于:2023-10-12 17:44:49,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1485420.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:表单   链接   Angular

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!