AngularJS Resource not Resolved

Question

I am new to AngularJS, so please be gentle.

I want to retrieve data from my backend using the $resource property of AngularJS, however it seems that the property is getting loaded before the actual call is completed.

Currently I have the following code:

Controller:

MyApp.controller('IndexCtrl', function IndexCtrl($scope, socket, carsRes) {
    console.log(carsRes.cars.get());
    $scope.cars = carsRes.cars.get();
});

Factory

.factory('carsRes', function($resource) {
        var result = {};
        result.cars = $resource('/cars/:id', {}, {
            'get': {method: 'GET'},
            'save': {method: 'POST'},
            'query': {method: 'GET', isArray: true},
            'remove': {method: 'DELETE'},
            'delete': {method: 'DELETE'}
        });

        return result;
 });

But at the point where I want to store carsRes.cars.get() in $scope.cars the call isn't completed yet, and a console.log tells me that the $resolved is still false.

How can I wait for the call to be resolved? I've read something about $q but it isn't really clear to me.

After poking around some more I found something that works: carsRes.cars.get(function(data){ $scope.cars = data.doc; }); Is this a proper solution? — DirkZz
– DirkZz, Commented Apr 13, 2013 at 14:32

jszobody · Accepted Answer · 2013-04-13 20:46:45Z

6

This is happening because resource.get() is asynchronous. It returns an empty reference immediately, and is then populated with the actual data once the ajax call is complete.

The best way to handle the result is with a callback function:

carsRes.cars.get(function(response){ 
    // We now have a completed ajax call, with the response
    $scope.cars = response;
});

See more examples in the $resource documentation.

edited Apr 13, 2013 at 20:46

answered Apr 13, 2013 at 14:43

jszobody

29k6 gold badges66 silver badges76 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

joakimbl Over a year ago

Actually - unlike $http, the ngResource object methods doesn't return a promise: It is important to realize that invoking a $resource object method immediately returns an empty reference (object or array depending on isArray). Once the data is returned from the server the existing reference is populated with the actual data.

jszobody Over a year ago

@joakimbl Thanks for the correction! I was thinking $http. Updated the answer.

Maarten Over a year ago

I was looking for a promise on ngResource as well.. Thanks for pointing out! So you also can't resolve a route using ngResource?

Collectives™ on Stack Overflow

AngularJS Resource not Resolved

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related