Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Using AngularJS $resource to get data

I am trying to use $resource to get data from a static json file and here is the code snippet :

 angular.module('app.services', ['ngResource']).
  factory('profilelist',function($resource){
    return $resource('services/profiles/profilelist.json',{},{
        query:{method:'GET'}
    });
});

In the controller,

function ProfileCtrl($scope,profilelist) {
$scope.items = [];
$scope.profileslist = profilelist.query();
for (var i=0;i<=$scope.profileslist.length;i++){
    if($scope.profileslist[i] && $scope.profileslist[i].profileid){
        var temp_profile = $scope.profileslist[i].profileid;
    }
    $scope.items.push(temp_profile);

}

But now, I am facing an error : TypeError: Object #<Resource> has no method 'push'

Could you please help me where I am going wrong ?

like image 265
codejammer Avatar asked Mar 17 '13 21:03

codejammer


People also ask

What is $resource in AngularJS?

Overview. A factory which creates a resource object that lets you interact with RESTful server-side data sources. The returned resource object has action methods which provide high-level behaviors without the need to interact with the low level $http service. Requires the ngResource module to be installed.

Does AngularJS need data to be in JSON format to populate its model?

AngularJS needs data in which format to populate its model? Explanation: AngularJS needs data in JSON format to populate its model.

What is the use of $window in AngularJS?

The $window service refers to the browser window object. It is globally available in JavaScript, so it causes testability problems. In AngularJS, it is not globally available. It includes various methods like alert box, prompt box, confirms box, etc.

What is $q in AngularJS?

$q is integrated with the $rootScope. Scope Scope model observation mechanism in AngularJS, which means faster propagation of resolution or rejection into your models and avoiding unnecessary browser repaints, which would result in flickering UI. Q has many more features than $q, but that comes at a cost of bytes.


1 Answers

You don't need to specify actions parameter for default $resource methods (these are 'get', 'save', 'query', 'remove', 'delete'). In this case you can use .query() method as is (this requires only service definition to be chaged):

angular.module('app.services', ['ngResource']).
  factory('profilelist',function($resource){
    return $resource('services/profiles/profilelist.json');
  });

P.S. And one more hint is that your example unwrapped json into hash rather then array (that's why you received no push method error), if you need it to be an array set isArray: true to action config:

'query':  {method:'GET', isArray:true}

And as @finishingmove spotted you really can't assign $resource result to obtain immediately, provide callback:

$scope.profileslist = profilelist.query(function (response) {
    angular.forEach(response, function (item) {
        if (item.profileid) {
            $scope.items.push(item.profileid);
        }
    });
});
like image 184
Dmitry Evseev Avatar answered Nov 03 '22 05:11

Dmitry Evseev