How to call an angular resource from a service

Question

I am using Angular 1.1.5 (wait for angular-ui-router to be comptabible with 1.2.0). I defined a resource and a service:

myapp.factory( 'Monitoring', function($resource) {
   return $resource('/webapp/network/v1/cronjobs/:id/:action', { id: '@id' }, {
       status: { method: 'PATCH', headers:{'Content-Type': 'application/json'}, params:{action: 'status'}}
   }
 );
});

myapp.factory('MonitoringCRUDControllerService', ['Monitoring', '$state', function(Monitoring, $state) {
    return {
        query: function() {
            var m = new Monitoring();
            var promise = m.$query().then(function(response) {
                console.log(response);
                return response.data;
            });
            return promise;
        },
        query1: function() {
            var m = new Monitoring();
            return m.$query();
        },
        // Angular 1.2.0 RC
        query2: function() {
            var m = new Monitoring();
            return m.$query().$promise;
        }       
    }
}]);

In my controller I tried query and query1 but both of them returned Cannot call method 'then' of undefined. The query2 should be the 1.2.0 way to call the resource.

EDIT: Updated controller

function($scope, $location, MonitoringCRUDControllerService) {
    $scope.refresh = function() {
        MonitoringCRUDControllerService.query().then(function(value) {
            $scope.myData = value;
        });
    };
}

console.log(MonitoringCRUDControllerService) returns Object {create: function, get: function, query1: function, query2: function, update: function…}

EDIT2:

I tried as suggested

query3: function() {
    return Monitoring.query();
},
query4: function() {
    var m = new Monitoring();
    var promise = m.query().then(function(response) {
        console.log(response);
        return response.data;
    });
    return promise;
},

query3 returns a promise on which you can call $then and not then and it works.

query4 returns an error Object #<Resource> has no method 'query'. The reason I used the new is for passing arguments (this is how it's documented): See also Angular resource REST has no method '$save'

Where is the `refresh` method define. It seems that `MonitoringCRUDControllerService` is not being injected into controller. Please show the controller code. — Chandermani, Aug 26 '13 at 08:06
I think you should invoke the `Monitoring` object method using `query` instead of $query. `var promise = m.query()` — Chandermani, Aug 26 '13 at 08:49
I think you can also do `Monitoring.query()` instead of creating with `new` — Chandermani, Aug 26 '13 at 08:53
See Edit2, could it be because I use Angular 1.1.5 which is `unstable`? — Sydney, Aug 26 '13 at 09:36
You can still pass parameters with `Monitoring.query({id:1,action:test})` this would get bind to the template url, if it is not defined on template url, they get passed as querystring. — Chandermani, Aug 26 '13 at 09:59
I am not sure about the `new Monitor()` behavior i don't think it is a constructor function. — Chandermani, Aug 26 '13 at 10:01

score 0 · Answer 1 · answered Aug 26 '13 at 06:51

0

Inject the service in your controller like;

yourApp.controller('ControllerName',function(MonitoringCRUDControllerService){
    $scope.refresh = function() {
        MonitoringCRUDControllerService.query().then(function(value) {
            $scope.myData = value;
        });
    };
});

Hope it helps.

answered Aug 26 '13 at 06:51

BKM

6,949
7
30
45

It was already done, the error is on the `then`, so it means the query is executed, but the returned object is undefined. – Sydney Aug 26 '13 at 06:55
Try changing the function name from query to something else, say 'get' and call it like MonitoringCRUDControllerService.get(); – BKM Aug 26 '13 at 06:57

How to call an angular resource from a service

1 Answers1