Question

Could you explain in general what does this code do:

App.config(['$httpProvider', function ($httpProvider) {
  $httpProvider.responseInterceptors.push('HttpSpinnerInterceptor');
  $httpProvider.defaults.transformRequest.push(function (data, headersGetter) {
    angular.element('.brand img').attr("src","<%= asset_path('brand/brand.gif') %>");
    return data;
  });
}]);

App.factory('HttpSpinnerInterceptor', function ($q, $window) {
  return function (promise) {
    return promise.then(function (response) {
      angular.element('.brand img').attr("src","<%= asset_path('brand/brand.png') %>");
      return response;
    }, function (response) {
      angular.element('.brand img').attr("src","<%= asset_path('brand/brand.png') %>");
      return $q.reject(response);
    });
  };
});

I have completely no understanding except some guesses that it intercepts some response and injects a src attribute of image.

I do not understand how and when is HttpSpinnerInterceptor called and what the “promise” parameter is.

Answer 1

1. HttpSpinnerInterceptor is been called after each request issued by using $http service is completed (successfully or not), but before promise is been resolved to caller (so you can defer result). Actually transform request is not needed, because it does mostly same as HttpSpinnerInterceptor (or HttpSpinnerInterceptor is not needed…), because it does not transform anything.

2. promise parameter is a $q promise that could be used in case if you need to perform some async actions when with result of your request as you can resole it later, so caller would get result later. Actually in your code, you directly resolve this promise (or reject it), changing src attribute of the image.

Here are some links to documentation:

1. Using $http service: http://docs.angularjs.org/api/ng.$http – take careful look at “Response interceptors” and “Transforming Requests and Responses“
2. Promises in AngularJS: http://docs.angularjs.org/api/ng.$q