angularjs - 防止在angularjs中多次提交

Question

我正在寻找一种基于 AngularJS 的方法来防止每个任务多次提交。

我不需要在提交后禁用按钮或关闭表单并等待任务完成。相反，我需要请求是唯一的。

更详细地说，我需要$http.get和 $http.post停止发送多个相同的请求。

有任何想法吗？

Answer 1

根据这篇文章，您可以使用提供者装饰器。
注意:此方法基于 angular-api
https://gist.github.com/adambuczynski/354364e2a58786e2be71

更新

我在你建议的解决方案中做了一点改动，因为返回的 promise 丢失了 .success和 .error和 .then .
只需使用此编辑过的代码即可使所有这些功能正常工作:

    .config(["$provide", function ($provide) {
    $provide.decorator('$http', function ($delegate, $q) {

        var pendingRequests = {};
        var $http = $delegate;

        function hash(str) {
            var h = 0;
            var strlen = str.length;
            if (strlen === 0) {
                return h;
            }
            for (var i = 0, n; i < strlen; ++i) {
                n = str.charCodeAt(i);
                h = ((h << 5) - h) + n;
                h = h & h;
            }
            return h >>> 0;
        }

        function getRequestIdentifier(config) {
            var str = config.method + config.url;
            if (config.data && typeof config.data === 'object') {
                str += angular.toJson(config.data);
            }
            return hash(str);
        }

        var $duplicateRequestsFilter = function (config) {

            if (config.ignoreDuplicateRequest) {
                return $http(config);
            }

            var identifier = getRequestIdentifier(config);

            if (pendingRequests[identifier]) {
                if (config.rejectDuplicateRequest) {
                    return $q.reject({
                        data: '',
                        headers: {},
                        status: config.rejectDuplicateStatusCode || 400,
                        config: config
                    });
                }
                return pendingRequests[identifier];
            }

            pendingRequests[identifier] = $http(config);

            $http(config).finally(function () {
                delete pendingRequests[identifier];
            });

            return pendingRequests[identifier];
        };

        Object.keys($http).filter(function (key) {
            return (typeof $http[key] === 'function');
        }).forEach(function (key) {
            $duplicateRequestsFilter[key] = $http[key];
        });

        return $duplicateRequestsFilter;
    })
}])