Usage of interceptor within $resource

Question

How do I use an interceptor within an Angular $resource?

My JSON structure:

var dgs = [{id    :1,
            driver:'Sam',
            type:  'bus',
            segments:[{id:1,origin:'the bakery',arrival:'the store'},
                      {id:2,origin:'the store' ,arrival:'somewhere'}]
            },
            { ... },
            { ... }
          ];

My controller is the following:

function dgCtrl($scope,$http,DriveGroup,Segment) {
  $scope.dgs = DriveGroup.query(function()
    // Code below may belong in a response interceptor?
    for (var i=0;i<$scope.dgs.length;i++) {
      var segments = $scope.dgs[i].segments;
      for (var j=0;j<segments.length;j++) {
        segments[j] = new Segment(segments[j]);
      }
    }
  });

My services, and what I tried using the interceptor object:

angular.module('dgService',['ngResource']).
  factory("DriveGroup",function($resource) {
    return $resource(
      '/path/dgs',
      {},
      {update:{method:'PUT'})
      {fetch :{method:'GET',
               // This is what I tried.
               interceptor:{
                 response:function(data) {
                   console.log('response',data);
                 },
                 responseError:function(data) {
                   console.log('error',data);
                 }
               },
               isArray:true
              }
    );
});

I read $resource, and it seems like this should work, but it doesn't, so I'm mis-understanding. Any suggestions?

score 6 · Answer 1 · answered Oct 09 '13 at 01:18

6

Your service is improperly formed. There are curly braces and parentheses int the wrong places.

Here is the correct version (modified slightly so that I could get it to run: http://jsfiddle.net/roadprophet/VwS2t/

angular.module('dgService', ['ngResource']).
factory("DriveGroup", function ($resource) {
    return $resource(
        '/', {}, {
        update: {
            method: 'PUT'
        },
        fetch: {
            method: 'GET',
            // This is what I tried.
            interceptor: {
                response: function (data) {
                    console.log('response in interceptor', data);
                },
                responseError: function (data) {
                    console.log('error in interceptor', data);
                }
            },
            isArray: false
        }
    }

    );
});

answered Oct 09 '13 at 01:18

Erstad.Stephen

1,035
7
9

I don't see the difference between your version of the service and the original? – deitch Feb 23 '14 at 12:21
1

Your JavaScript was improperly formed which is why your interceptor wasn't working. Notice that you shouldn't have curly braces aroung the fetch and update property assignments. – Erstad.Stephen Feb 24 '14 at 19:36
2

Ah, now I see it. Yet another example of the classical psychology phenomenon of seeing what one expects to see! :-) – deitch Feb 25 '14 at 07:52
Important to note that if you create your own interceptor, the default interceptor which returns `response.resource` will not run. So if you are expecting a response in the above code, you need to include `return data.response` in the interceptor's methods. More info [here](https://github.com/angular/angular.js/issues/11201#issuecomment-76367339) – Ben Jul 12 '17 at 19:30

Usage of interceptor within $resource

1 Answers1

Linked