使用 AngularJS 将表单发布到新窗口答案

【问题标题】：Form Post to new window with AngularJS使用 AngularJS 将表单发布到新窗口
【发布时间】：2014-09-30 18:45:06
【问题描述】：

目前我有一个提交表单 POST 并在新窗口中打开的 JavaScript 方法。我想用 AngularJS 重写它。

这是现有的方法。传入的3个参数只影响post URL和POST上的一些数据值。

var login = function(postUrl, samlResponse, samlDomain){
    var form = $('<form></form>');
    form.attr('method', 'post');
    form.attr('action', postUrl);
    form.attr('target', '_blank');
    var field = $('<input></input>');
    field.attr('type', 'hidden');
    field.attr('name', samlResponse);
    field.attr('text-wrap','none');
    field.attr('value', 'response-value');
    form.append(field);
    var field2 = $('<input></input>');
    field2.attr('type', 'hidden');
    field2.attr('name', 'RelayState');
    field2.attr('value', samlDomain);
    form.append(field2);
    $(document.body).append(form);
    form.submit();
}

这是我在 AngularJS 中使用 $http 的尝试

$scope.login = function(postUrl, samlResponse, samlDomain) {
    var tabWindowId = window.open('about:blank', '_blank');
    var data = {
        SAMLResponse: samlResponse,
        RelayState: samlDomain
    }
    $http.post(postUrl, data).then(function (response) {
        tabWindowId.location.href = response.headers('Location');
    });
}

我还收到以下错误，这是因为网站不允许我访问响应。我不一定需要访问响应，我只想在新窗口中打开它。

XMLHttpRequest cannot load {{postUrl}}. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:7631' is therefore not allowed access.

我应该如何使用 AngularJS 完成我想要做的事情？

我还考虑将表单添加到 HTML 模板中，但使用 ng-hidden 将其隐藏。然后我必须以某种方式从我的 AngularJS 控制器中触发表单提交，这似乎是倒退的。

【问题讨论】：

标签： javascript angularjs forms http-post

【解决方案1】：

我最终将登录功能完全放在我的 AngularJS 控制器中。对此不太满意，因为我使用的是 jquery $(document.body).append(form)。但这是一个快速的解决方案，希望看到其他答案。

【讨论】：