Within my application, I am performing various manipulations with HTTP requests. For example:
$scope.fetchData = function(id) {
$http.get('/app/' + id, {
headers: {
'Content-Type': 'application/json',
}
})
.success(function(response) {
})
.error(function(data, status, headers, config) {
});
};
$scope.showNotification = function (message) {
var modalHtml = '<div class="modal-header"><h3>Notification</h3></div>';
modalHtml += '<div class="modal-body"><strong>' + message + '</strong></div>';
modalHtml += '<div class="modal-footer"><button class="btn-md btn-green pull-right" ng-click="$dismiss()">OK</button></div>';
$scope.modalInstance = $modal.open({
template: modalHtml,
size: 'sm',
backdrop: 'static',
keyboard: false
});
$timeout(function () {
$scope.modalInstance.close('closing');
}, 5000);
};
In addition, I have created an interceptor as follows:
var handleError = function (rejection) {
var rootScope = rootScope || $injector.get('$rootScope');
console.log(rootScope.showNotification('123'));
***
return $q.reject(rejection);
};
However, in this interceptor, how can I call the $scope.showNotification() method when there is an error?
I could handle it like this:
$scope.fetchData = function(id) {
$http.get('/app/' + id, {
headers: {
'Content-Type': 'application/json',
}
})
.success(function(response) {
})
.error(function(data, status, headers, config) {
$scope.showNotification('An error occurred.');
});
};
But this approach may not be ideal. What other options do I have?