AngularJS How to prevent duplicated http requests?

angularjs, http, javascript

Solution

I saw your link:

    $scope.fnRowCallback = function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {

        $('td:eq(4)', nRow).bind('click', function() {
            $scope.$apply(function() {
                $scope.openConsultedClientsLogsModal(aData.Operator, aData.LogDate);
            });
        });

        return nRow;
    };

You can unbind before doing the bind, this way you will prevent duplicates. Try like this:

    $scope.fnRowCallback = function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {



        //add this unbind to your code
        $('td:eq(4)', nRow).unbind("click");


        $('td:eq(4)', nRow).bind('click', function() {
            $scope.$apply(function() {
                $scope.openConsultedClientsLogsModal(aData.Operator, aData.LogDate);
            });
        });

        return nRow;
    };

I hope this helps.

Problem

I'm struggling for the past day with some weird situation. What's happening is that for an http request to an API on a remote server occasionally duplicate requests are being sent. Can anyone please provide help on how to avoid these duplicated requests? Here is an example of a function that I use on a factory: ``` factory.getAllConsultedClientsLogs = function(oParams) { var deferred = $q.defer(); $http.post('url/to/api', oParams) .success(function(response) { deferred.resolve(response); }) .error(function() { deferred.reject("Error! @factory.getAllConsultedClientsLogs"); }); return deferred.promise; }; ``` ...and an example of a function using the above indicated on a controller: ``` $scope.openConsultedClientsLogsModal = function(operator, date) { if (angular.isDefined(operator) && angular.isDefined(date)) { RrAuditingFactory.getAllConsultedClientsLogs({'operator':operator,'date':date}).then(function(promise) { if (angular.isObject(promise) && angular.isDefined(promise.error) && promise.error == 0) { var modalInstance = $modal.open({ templateUrl: 'path/partial', controller: function($scope, $modalInstance, logsResult) { $scope.logsResult = logsResult; }, resolve: { logsResult: function() { return promise.result; } } }); modalInstance.result.then(function() { }, function () { }); } else { ErrorContext.setError(promise.errorMsg); } }, function(promise) { ErrorContext.setError(promise); }); } else { ErrorContext.setError(); } }; ``` Thank you in advance.. hope that anyone could help me out...

Original source