How to remove $promise and $resolved from json object

Question

I'm using $resource in angular to get json object and its structure is defined below

[
    {
        "id": 0,
        "name": "Type1"
    },
    {
        "id": 1,
        "name": "Type 2"
    }
]

after fetching the data .. console.log(jsonObject) gives me

[Resource, Resource, $promise: Object, $resolved: true]

How can I remove $promise & $resolved from the resulting object ? I tried angular.fromJson(json) but still I see that these objects still exist.

Answer 1

I'm looking for the same answer, but at this moment I know only this ugly hack:

To write a func like this:

function cleanResponse(resp) {
    return JSON.parse(angular.toJson(resp));
}

and call it in every single query (ugly, yep):

function getSmt() {
    Resource.get({}, function (data) {
        $scope.some = cleanResponse(data);
    }, function (responce) {
        //handle error
    })
}

I'll be happy if someone would teach me how to do it correctly

Answer 2

Example from my project

Diary.getSharedWithMe(function(data) {
        delete data.$promise;
        delete data.$resolved;
        _self.sharedDiariesWithMe = data;
    }, function(error) {
        console.log(error)
    });

Answer 3

从这个答案 ，它看起来yourResource.toJSON()随时可用。

Answer 4

Right, I've faced the same problem several times and always ended up using $http instead of $resource, however , today I decided to try and deal with this issue. I hope somebody will find this useful one day as well.

So, after you receive your object with $promise inside of it, what you do is just use angular.copy(data) , like so:

someService.getSomething($scope.someId).$promise.then(function (data) {
    if (data) {
        $scope.dataWithoutPromise = angular.copy(data);
    }
});

After that, you will see that your dataWithoutPromise just contains the objects that you need, and $promise and $resolved are gone.

Answer 5

I'm facing the same issue. In fact, you simply have to use the same version of angular and angular-resource and it will work like a charm. Hope it helps !

Answer 6

Short answer : angular.fromJson(angular.toJson(resp)); This will remove all "angular specific" functions etc and will return you a clean data object.

Answer 7

Are you using isArray or .query() with your $resource object?

From the $resource docs: isArray – {boolean=} – If true then the returned object for this action is an array.

UPDATE:

If you are using $resource correctly, some options you have are:

1) Have the backend return the data contained within an object, eg. { data: [] } rather than just an array.

2) If that is not possible, use the callback from the $resource.query() , eg.

MyResource.query({ myParams: 'something'}, function(result) {
    // Do something with the plain result
});

Answer 8

I did this quick reusable method for angular.toJson (Properties with leading $$ will be stripped):

yourApp.factory('Service', ['$resource', function ($resource) {
    return $resource('your/rest/api/path');
}]);

 yourApp.factory('commonServices', function () { 
         return {
                toJson : function(response){
                    return JSON.parse(angular.toJson(response));
                     //*or* 
                    //return angular.toJson(response);
                }
    });

And then something like this in your controller:

 yourApp.controller('Controller', ['$scope', 'Service','commonServices',  
function ($scope, Service, commonServices) {
            Service.get().then(function (data) {
                $scope.myData = commonServices.toJson(data);
            });
        });

the more simple way is to add angular.toJson in the controller

 yourApp.controller('Controller', ['$scope', 'Service',  
function ($scope, Service, commonServices) {
            Service.get().then(function (data) {
                $scope.myData = angular.toJson(data);
            });
        });

Answer 9

Please simply do this:

jsonObject.$promise = undefined; jsonObject.$resolved = undefined;

$promise and $resolved will not be removed but you will be able to do what you want.

Answer 10

Try to code something like this in your service:

yourApp.factory('Service', ['$resource', function ($resource) {
    return $resource('your/rest/api/path');
}]);

And then something like this in your controller:

yourApp.controller('Controller', ['$scope', 'Service', function ($scope, Service) {
    Service.get().then(function (data) {
        $scope.myData = data;
    });
});