I have a module(app) which contains inside a service(globalService) with $http
. This module now is included inside another module (invoicesApp) which has a service(invoicesService) too. Using the service of the second module I’m loading the service of the first service and returning back some information. The problem which I’m having is that the parameters of the first service are overridden from the second service and for that reason both $http
are executing the same request. Here is my code
This is my first Service:
(function(angular){
var app = angular.module('app',[])
.config(function($locationProvider) {
$locationProvider.html5Mode({
enabled: true,
requireBase: false
});
})
.service('globalService', function($http, $location,$q){
console.log("globalService");
this.getPaging = function()
{
var deferred = $q.defer();
var paging_parameters = $location.search();
paging_parameters.action = "client_pagination";
var req = {
url: ajaxpagingscript.ajaxurl,
method: "GET",
params: paging_parameters
}
$http(req).success(function(paging_data) {
console.log("globalService " + JSON.stringify(paging_data));
deferred.resolve(paging_data.paging);
}).error(function(data, status, headers)
{
$scope.error = "";
});
return deferred.promise;
}
});
})(window.angular);
Second Service:
(function(angular){
var invoicesApp = angular.module('invoicesApp',['ngRoute','app'])
.config(function($locationProvider,$routeProvider) {
$locationProvider.html5Mode({
enabled: true,
requireBase: false
});
})
.controller('InvoicesController', ['$scope','transactionService',
function($scope,invoicesService) {
$scope.invoices = [];
console.log("testing");
var paging = invoicesService.getPaging();
var promise = invoicesService.getInvoicess();
promise.then(function(data)
{
console.log("invoices " +JSON.stringify(data));
angular.forEach(data.new_data, function(JSON_ARRAY) {
$scope.invoicearray.push(JSON_ARRAY);
});
});
}])
.service('invoicesService', function(globalService, $http,$location,$q){
this.getPaging = function() { return globalService.getPaging(); };
this.getInvoicess = function() {
var deferred = $q.defer();
var invoices_parameters = $location.search();
invoices_parameters.action = "collect_invoice_data";
var req = {
url: ajaxpagingscript.ajaxurl,
method: "GET",
params: invoices_parameters
};
$http(req).success(function(data) {
deferred.resolve(data);
}).error(function(data, status, headers)
{
$scope.error = "";
});
return deferred.promise;
};
});
})(window.angular);
The console.log for both services, returning back the same data. The page that loads this app, loads invoicesApp
so the globalService is executed fine but the parameters that pass to $http
are wrong. Can anyone help me?
You don’t need to call the function, you need to pass the reference of the function if that is what you are trying to do in invoicesService.
should be