AngularJS:每次启动ajax调用时都需要触发事件
AngularJS:每次启动ajax调用时都需要触发事件
提问于 2012-12-06 22:46:26
每次启动ajax调用时，我都会尝试在$rootScope上触发一个事件。
var App = angular.module('MyApp');
App.config(function ($httpProvider) {
//add a transformRequest to preprocess request
$httpProvider.defaults.transformRequest.push(function () {
//resolving $rootScope manually since it's not possible to resolve instances in config blocks
var $rootScope = angular.injector(['ng']).get('$rootScope');
$rootScope.$broadcast('httpCallStarted');
var $log = angular.injector(['ng']).get('$log');
$log.log('httpCallStarted');
});
});事件'httpCallStarted‘它没有被触发。我怀疑在配置块中使用$rootScope或任何其他实例服务是不正确的。如果是这样，我如何才能在每次http调用开始时都获得一个事件，而不必在每次进行调用时都传入一个config对象？
提前感谢
回答 4
Stack Overflow用户
回答已采纳
发布于 2012-12-06 23:56:45
您总是可以将$http包装在服务中。因为服务只设置一次，所以您可以让服务工厂为您设置事件。老实说，对我来说，这感觉有点老土，但这是一个很好的解决方案，因为Angular还没有一个全球的方法来做到这一点，除非在1.0.3中添加了一些我不知道的东西。
Here's a plunker of it working
下面是代码：
app.factory('httpPreConfig', ['$http', '$rootScope', function($http, $rootScope) {
$http.defaults.transformRequest.push(function (data) {
$rootScope.$broadcast('httpCallStarted');
return data;
});
$http.defaults.transformResponse.push(function(data){
$rootScope.$broadcast('httpCallStopped');
return data;
})
return $http;
}]);
app.controller('MainCtrl', function($scope, httpPreConfig) {
$scope.status = [];
$scope.$on('httpCallStarted', function(e) {
$scope.status.push('started');
});
$scope.$on('httpCallStopped', function(e) {
$scope.status.push('stopped');
});
$scope.sendGet = function (){
httpPreConfig.get('test.json');
};
});Stack Overflow用户
发布于 2012-12-08 00:35:58
我已经验证了这段代码将会像您期望的那样工作。如上所述，您没有检索到您认为自己是的注入器，并且需要检索正在用于您的应用程序的注入器。
discussionApp.config(function($httpProvider) {
$httpProvider.defaults.transformRequest.push(function(data) {
var $injector, $log, $rootScope;
$injector = angular.element('#someid').injector();
$rootScope = $injector.get('$rootScope');
$rootScope.$broadcast('httpCallStarted');
$log = $injector.get('$log');
$log.log('httpCallStarted');
return data;
});
});Stack Overflow用户
发布于 2014-01-31 11:01:27
Cagatay是对的。更好地使用$http拦截器：
app.config(function ($httpProvider, $provide) {
$provide.factory('httpInterceptor', function ($q, $rootScope) {
return {
'request': function (config) {
// intercept and change config: e.g. change the URL
// config.url += '?nocache=' + (new Date()).getTime();
// broadcasting 'httpRequest' event
$rootScope.$broadcast('httpRequest', config);
return config || $q.when(config);
},
'response': function (response) {
// we can intercept and change response here...
// broadcasting 'httpResponse' event
$rootScope.$broadcast('httpResponse', response);
return response || $q.when(response);
},
'requestError': function (rejection) {
// broadcasting 'httpRequestError' event
$rootScope.$broadcast('httpRequestError', rejection);
return $q.reject(rejection);
},
'responseError': function (rejection) {
// broadcasting 'httpResponseError' event
$rootScope.$broadcast('httpResponseError', rejection);
return $q.reject(rejection);
}
};
});
$httpProvider.interceptors.push('httpInterceptor');
});我认为interceptors适用于1.1.x之后的版本。在那个版本之前有responseInterceptors。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/13746052
复制相关文章
相似问题