AngularJS：为外部URL发布请求设置http标头

Question

要求是将数据从Angular Controller发布到外部URL。在尝试了各种方法之后，我发现在下面的博客中建议的方法

http://shincoding.com/angularjs/programmatically-submitting-angularjs-form-to-an-external-url/#comment-239

问题是我需要在HTTP标头中发送一些自定义参数。我无法实现同样的目标。我甚至尝试过拦截器，但它们没有用。我甚至尝试在指令中使用控制器，但也没有用。

HTML代码

<div class="row continue_login append_bottom10">
            <div class="col-lg-3 col-md-3 col-sm-4 col-xs-5 fullWidth append_bottom8">
                <input type="submit" class="btn" name="submit" value="Test HTTP POST" ng-click="proceedWithCheckout()"/>
                <input type="reset" class="btn" name="reset" value="Cancel"/>
            </div>
        </div>
        <div auto-submit-form event="gateway.redirect"></div>

角度控制器

kmphApp.controller("PGCtrl", function ($scope, $http, $location, $rootScope, $sce) {

    $scope.proceedWithCheckout = function () {

        var signature;
        $http.post('/genRequestHMAC',
            {username: $scope.kmph_user, password: $scope.kmph_pwd})
            .success(function (data, status, headers, config) {

                var hmacData = data;
                if (hmacData != undefined) {
                    signature = hmacData.signature;
                    alert('inside this' + signature);


                    var data = {
                        redirectUrl: 'https://sandbox.mypaymentgateway.com',
                        redirectMethod: 'POST',
                        redirectData: {
                            'input1': 'value1',
                            'input2': 'value2'
                        }
                    }
                    data.redirectUrl = $sce.trustAsResourceUrl(data.redirectUrl);


                    $rootScope.$broadcast('gateway.redirect', data);
                } else {
                    //$location.path("/");
                }
            })
            .error(function (data, status, headers, config) {
                alert('failure');
            })
    }
});

kmphApp.directive('autoSubmitForm', ['$timeout', function ($timeout) {
    return {
        replace: true,
        scope: {},
        template: '<form action="{{formData.redirectUrl}}" method="{{formData.redirectMethod}}">' +
        '<div ng-repeat="(key,val) in formData.redirectData">' +
        '<input type="hidden" name="{{key}}" value="{{val}}" />' +
        '</div>' +
        '</form>',
        controller: function($scope, $element, $attrs, $http) {
            $http.defaults.headers.common["X-Vik"]='123';
            console.log('$http='+$http.defaults.headers.common["X-Vik"]);
        },
        link: function ($scope, element, $attrs) {
            $scope.$on($attrs['event'], function (event, data) {


                $scope.formData = data;
                console.log('redirecting now!');
                $timeout(function () {
                    element.submit();
                })
            })
        }
    };
}]);