restangular/django: "TypeError: Object #<Resource> has no method 'push'" (RestangularProvider.setResponseExtractor not being called?)

Question

Update 2

I upgraded from 0.6.1 to 1.0.9 which fixed the issue. It appears as thought there were two fixes in versions 0.8.7 and 0.8.8 that were needed to make this work. In 0.8.7 it does make the call to the reourceExtractor, but still errors out w/ this trace:

Error: $digest already in progress at Error () at beginPhase (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js:8334:15) at Object.$get.Scope.$apply (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js:8136:11) at HTMLDivElement.ngEventDirectives.(anonymous function) (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js:12986:17) at event.preventDefault (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js:1992:10) at Array.forEach (native) at forEach (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js:130:11) at eventHandler (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js:1991:5) at HTMLDivElement.forEach.bind.events.(anonymous function) (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js:2067:15) at event.preventDefault (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js:1992:10)

however 0.8.8 seems to have cleared all that up. I am going to continue to poke around and see if there are any other oddities.

I don't know how I ended up with such an old version of restangular.

---

Update:

so tracing through the javascript

angular-resource.js::ResourceFactory

is being called the success variable is the anonymous function from

restangular.js::fetchFunction

where the responseExtractor is the function I set up in my app. So this all looks good??? in

angular-resource.js::ResourceFactory

the REST call is made and the data variable contains the correct REST response. It is falling apart here in the same function:

if (data) {
    if (action.isArray) {
        value.length = 0;
        forEach(data, function(item) {
            value.push(new Resource(item));
        });
    } else {
        copy(data, value);
    }
}

the error is occurring @ value.push(new Resource(item)); where value is essentially the JSON rest response.

I read that angular resource requires you to define the rest resource and response and part of the definition is defining the array portions. I don't know if that is the root cause - but I thought restangular took care of that for me. Still more digging to do. Any help is -still- appreciated.

Thx

---

So I am learning Angular and Django simultaneously. I have used Django rest services to build a service to return some simple JSON. That part is working fine, but I cannot seem to get it hooked up with /restangular. The REST call is happening, and json is being returned - but the responseExtractor doesn't seem to be getting called. I have been fidgeting around and can't seem to put my finger on it.

Thank you in advance

adding the call stack:

TypeError: Object # has no method 'push' at U (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js:10:257) at new Resource (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular-resource.js:350:9) at http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular-resource.js:407:32 at m (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js:6:494) at http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular-resource.js:406:19 at h (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js:78:33) at http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js:78:266 at Object.e.$eval (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js:88:347) at Object.e.$digest (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js:86:198) at Object.e.$apply (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js:88:506)

non min stack

TypeError: Object # has no method 'push' at copy (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js:593:21) at new Resource (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular-resource.js:350:9) at angular.module.factory.Resource.(anonymous function) (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular-resource.js:407:32) at forEach (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js:137:20) at angular.module.factory.Resource.(anonymous function) (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular-resource.js:406:19) at deferred.promise.then.wrappedCallback (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js:6846:59) at ref.then (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js:6883:26) at Object.$get.Scope.$eval (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js:8057:28) at Object.$get.Scope.$digest (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js:7922:25) at Object.$get.Scope.$apply (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js:8143:24)

looking at the code, the responseExtractor method is stored in the variable "a" which I don't see in the stack.

JSON

{
    "count": 2
    , "next": null
    , "previous": null
    , "results": [{"file": "tb.png", "caption": "dfsdffs", "id": 1}
        , {"file": "tannin_tasting.jpg", "caption": "tannin tasting", "id": 2}
    ]
}

Javascript (edit: fixed cut paste error mentioned by sza)

    angular.module('spaceJam', ['ui.bootstrap', 'restangular'])
        .config(function(RestangularProvider) {
             RestangularProvider.setResponseExtractor(function(response, operation) {
                 alert('here')
                 if (operation === "getList") {

                    var newResponse = response.results;
                    newResponse._resultmeta = {
                        "count": response.count,
                        "next": response.next,
                        "previous": response.previous
                    };
                    return newResponse;
                }

                return response;
             });
        });


var CarouselCtrl = function ($scope, Restangular) {

    Restangular.all('images/?format=json').getList().then(function(images) {
        alert(1)
        $scope.items = images;
    });


    $scope.myInterval = 3000;
    $scope.template = "/resources/angularViews/carousel.html"
    var slides = $scope.slides =  [
        {'type': 'image', 'name': '/resources/img/pinot_noir_glass.jpg'}
        , {'type': 'image', 'name': '/resources/img/toast1.jpg'}
        , {'type': 'image', 'name': '/resources/img/vinyard1.jpg'}
        , {'type': 'image', 'name': '/resources/img/tannin_tasting.jpg'}
    ]
}

Answer 1

Basically you were having that problem because Restangular was using $resource underneath. Since version 0.8.7 and 0.8.8 I ditched $resource and started using $http below as $resource was bringing a lot of problems. Once of them was the one you were facing.

If you find any other issue, please add an issue at Github.

Thanks!

Answer 2

See original post. Upgrade solved the problem.