Interceptors and ng-bind

Question

I´m learning Interceptors. I´m “printing” on the console the results, but I would like to show them on screen like {{}} or with ng-bind. I tried but I could not do it.

Anyone could help me?

x.factory("inter", ["$q", function($q) {
  return {
    request: function(config) {
      console.log("Request: " + JSON.stringify(config));
      return config;
    }
  };
}]);

x.config(["$httpProvider", function($httpProvider) {
  $httpProvider.interceptors.push("inter");
}]);

Thanks!

Answer 1

Replace your code with

x.factory("inter", ["$q", function($q) {
  var configs = [];
  return {
    request: function(config) { 
      configs.push("Request: " + JSON.stringify(config)); 
      return config;
    },
    interceptedConfigs: configs
  };
}]);

x.config(["$httpProvider", function($httpProvider) {
  $httpProvider.interceptors.push("inter");
}

Then, in the controller controlling the view where you want to print the configs, inject the interceptor, and expose its configs to the scope:

x.controller('SomeCtrl', function($scope, inter) {
  $scope.interceptedConfigs = inter.interceptedConfigs;
});

and then in the view of that controller:

{{ interceptedConfigs }}