angularjs将表单提交给存储在模型中的url

时间:2021-07-06 19:39:14

I have an angular application that needs to submit a form to a vendor. Each time the process is run, the vendor specifies the url that the form must be submitted to. Then the application submits to that url. Then the vendor redirects the client's browser to a page that my application has specified in an earlier step.

我有一个角度应用程序需要向供应商提交表单。每次运行该进程时,供应商都会指定必须提交表单的URL。然后应用程序提交到该URL。然后,供应商将客户端的浏览器重定向到我的应用程序在前面的步骤中指定的页面。

I can make it submit with a hardcoded url in the form action. Eg:

我可以在表单操作中使用硬编码的url进行提交。例如:

<form method="post" ng-submit="preSubmit()" 
      action="https://posttestserver.com/post.php">

But I need to submit to the url that the vendor has just specified. I have this value stored as $scope.formActionUrl.

但我需要提交供应商刚才指定的网址。我将此值存储为$ scope.formActionUrl。

So, I try to submit my form to the value of formActionUrl:

所以,我尝试将表单提交给formActionUrl的值:

<form method="post" ng-submit="preSubmit()" action="{{formActionUrl}}">

It doesn't submit. No errors logged to the console.

它没有提交。没有错误记录到控制台。

If I do an inspect-element on the form, it shows me that the form action has been correctly assigned to the value stored in formActionUrl.

如果我在表单上执行inspect-element,它会向我显示表单操作已正确分配给存储在formActionUrl中的值。

My preSubmit function executes in both cases.

我的preSubmit函数在两种情况下都会执行。

The url that I need to submit to is https.

我需要提交的网址是https。

Anybody know how to get it to work?

有谁知道如何让它工作?

1 个解决方案

#1


2  

I think this problem is due to how angular trust Urls. If you read https://docs.angularjs.org/api/ng/service/$sce it will explain this in greater detail.

我认为这个问题是由于角度信任Urls的原因。如果您阅读https://docs.angularjs.org/api/ng/service/$sce,它将更详细地解释这一点。

By injecting the $sce service into your controller you can do the following:

通过将$ sce服务注入您的控制器,您可以执行以下操作:

$scope.formActionUrl = $sce.trustAsResourceUrl("https://posttestserver.com/post.php");

to tell AngularJS that this url is trusted. It will then appear in the action of your form.

告诉AngularJS这个网址是可信的。然后它将出现在表单的操作中。

Here is a quick fiddle to demonstrate, if you look in the rendered HTML the action is there, if you remove the $sce it will not work.

这是一个快速的小提示,如果你在渲染的HTML中查看动作就在那里,如果你删除$ sce它将无法工作。

http://jsbin.com/diyefevi/10/edit

#1


2  

I think this problem is due to how angular trust Urls. If you read https://docs.angularjs.org/api/ng/service/$sce it will explain this in greater detail.

我认为这个问题是由于角度信任Urls的原因。如果您阅读https://docs.angularjs.org/api/ng/service/$sce,它将更详细地解释这一点。

By injecting the $sce service into your controller you can do the following:

通过将$ sce服务注入您的控制器,您可以执行以下操作:

$scope.formActionUrl = $sce.trustAsResourceUrl("https://posttestserver.com/post.php");

to tell AngularJS that this url is trusted. It will then appear in the action of your form.

告诉AngularJS这个网址是可信的。然后它将出现在表单的操作中。

Here is a quick fiddle to demonstrate, if you look in the rendered HTML the action is there, if you remove the $sce it will not work.

这是一个快速的小提示,如果你在渲染的HTML中查看动作就在那里,如果你删除$ sce它将无法工作。

http://jsbin.com/diyefevi/10/edit