সময়সীমা সমাপ্তি সহ কৌণিক $ http অ্যাজাক্স বাতিল করা কৌণিক 1.3.15 এ কাজ করে না। এটি স্থির হওয়ার জন্য যারা অপেক্ষা করতে পারে না তাদের জন্য আমি কৌণিকের সাথে আবৃত একটি jQuery অ্যাজাক্স সমাধান ভাগ করছি।
সমাধান দুটি পরিষেবা জড়িত:
- এইচটিপিএস সার্ভিস (jQuery আজাক্স ফাংশন জুড়ে একটি মোড়ক);
- মুলতুবি রক্ষণাবেক্ষণ সার্ভিস (মুলতুবি থাকা / খোলা অ্যাজাক্স অনুরোধগুলি সন্ধান করে)
এখানে মুলতুবি রক্ষণাবেক্ষণ পরিষেবাটি যায়:
(function (angular) {
'use strict';
var app = angular.module('app');
app.service('PendingRequestsService', ["$log", function ($log) {
var $this = this;
var pending = [];
$this.add = function (request) {
pending.push(request);
};
$this.remove = function (request) {
pending = _.filter(pending, function (p) {
return p.url !== request;
});
};
$this.cancelAll = function () {
angular.forEach(pending, function (p) {
p.xhr.abort();
p.deferred.reject();
});
pending.length = 0;
};
}]);})(window.angular);
এইচটিপি সার্ভিস পরিষেবা:
(function (angular) {
'use strict';
var app = angular.module('app');
app.service('HttpService', ['$http', '$q', "$log", 'PendingRequestsService', function ($http, $q, $log, pendingRequests) {
this.post = function (url, params) {
var deferred = $q.defer();
var xhr = $.ASI.callMethod({
url: url,
data: params,
error: function() {
$log.log("ajax error");
}
});
pendingRequests.add({
url: url,
xhr: xhr,
deferred: deferred
});
xhr.done(function (data, textStatus, jqXhr) {
deferred.resolve(data);
})
.fail(function (jqXhr, textStatus, errorThrown) {
deferred.reject(errorThrown);
}).always(function (dataOrjqXhr, textStatus, jqXhrErrorThrown) {
//Once a request has failed or succeeded, remove it from the pending list
pendingRequests.remove(url);
});
return deferred.promise;
}
}]);
})(window.angular);
আপনার পরিষেবাতে পরে যখন আপনি ডেটা লোড করছেন আপনি HTTP এর পরিবর্তে $ HTTP ব্যবহার করবেন:
(function (angular) {
angular.module('app').service('dataService', ["HttpService", function (httpService) {
this.getResources = function (params) {
return httpService.post('/serverMethod', { param: params });
};
}]);
})(window.angular);
পরে আপনার কোডে আপনি ডেটা লোড করতে চান:
(function (angular) {
var app = angular.module('app');
app.controller('YourController', ["DataService", "PendingRequestsService", function (httpService, pendingRequestsService) {
dataService
.getResources(params)
.then(function (data) {
// do stuff
});
...
// later that day cancel requests
pendingRequestsService.cancelAll();
}]);
})(window.angular);
