Prevent multiple submissions in angularjs

Question

I am looking for a method based on AngularJS to prevent multiple submissions to a task.

I do not need buttons that need to be disabled after submitting or closing the form and waiting for the task to complete. Instead, I need unique queries.

To be more detailed, I need to $http.getand $http.poststop sending several identical requests.

Any ideas?

Answer 1

In accordance with this article, you can use the vendor's decorator.
NOTE. This approach is based on angular-api
https://gist.github.com/adambuczynski/354364e2a58786e2be71

---

UPDATE

, promises .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;
    })
}])

Answer 2

, .

URL- DATA . URL KEY. URL- .

URL-, , ( , ). , . . .

, , .

. JSON String, String.

Algo

YourService.call(url, params) {
    var Str1 = JSON.stringify(params);
    if(StoredObj[url]) {
        for each (StoredObj[url] as Str){
             if(Str === Str1) {
               return;
             }
        }
    }
    else {
       StoredObj[url] = []; //new Array
    }
    StoredObj[url].push(Str1);
    Call $http then;
}