Using a value from a get with ngResource in the controller

Question

I'm struggling with using the value that I got from a 'get' in my controller.

This is my code in my controller

vm.user;

function onInit(){
   loadUser(vm.queryParams.id[0]);
   console.log(vm.user);
}

function loadUser(UserId) {
    var defer = $q.defer();

    User.get({ id: userId }).$promise.then(function (user) {
        vm.user = user;
        defer.resolve();
    });

    return defer.promise;
};

When I print the vm.user in the onInit() it is undefined. While when I look on the view where vm.user is called it just shows me the correct values of the user. So it's not known after the loadUser() in the controller but it is in my view.

I would like to first 'get' the user and then use it for further logic in the onInit(). How to retrieve the user properly so I can further use it and call its values in the onInit()?

Vivz · Accepted Answer · 2017-06-28T14:44:50.987

1

You have to wait till the execution of loadUser() is finished so as the get the value of user.You can use the promise returned like this and do any calcualtions on it.

vm.user;

    function onInit(){
       var promise=loadUser(vm.queryParams.id[0]);
       promise.then(function(response){
       console.log(response);
    });

    }

    function loadUser(UserId) {
        var defer = $q.defer();

        User.get({ id: userId }).$promise.then(function (user) {
            vm.user = user;
            defer.resolve(vm.user);
        });

        return defer.promise;
    };

edited Jun 28 '17 at 14:44

answered Jun 28 '17 at 13:53

Vivz

6,625
2
17
33

Thanks for your answer. I changed my code to match your solution but I still get 'undefined' on the line of the console.log(response); . Maybe something is missing? – Nicholas Jun 28 '17 at 14:13
I have updated my answer. Is there any error in console? – Vivz Jun 28 '17 at 14:45
by resolving the vm.user it works indeed. However now I get a Resource object back and I can't get values of that. I tried following code in my onInit() vm.user = promise.then(function(response) { var resdata = JSON.parse(JSON.stringify(response)); console.log(resdata) return resdata; }); console.log(vm.user) The console.log(resdata) returns an object as I would like it. But the console.log(vm.user) looks like returning the promise Object. How to get it to return the same as console.log(resdata)? – Nicholas Jun 28 '17 at 14:53
What is the value inside promise object? – Vivz Jun 28 '17 at 15:17
You can add resdata to a vm instance inside .then and do your calculations there – Vivz Jun 28 '17 at 15:34
If I use following code: vm.user = promise.then(function(response) { vm.user = JSON.parse(JSON.stringify(response)); console.log(vm.user) return vm.user; }); console.log(vm.user) – Nicholas Jun 29 '17 at 06:58
Is this promise.then(function(response) { vm.user = JSON.parse(JSON.stringify(response)); console.log(vm.user) return vm.user; }); console.log(vm.user) working? – Vivz Jun 29 '17 at 07:04
Actually it seems your answer seems to solve my problem. When I use the global variable in a function that is bound to e.g. a button on my form it does get the value I want. So it solves my problem. Though I still actually don't know if there is way to use the value in the onInit() itself outside of the promise.then code. I'll mark your solution as the answer. – Nicholas Jun 29 '17 at 07:45
Glad I could be of help. Thanks. :) – Vivz Jun 29 '17 at 07:46

score 0 · Answer 2 · answered Jun 28 '17 at 14:45

Immediately invoke your init function at the beginning of your controller and convert your loadUser function to a service since its a get action. Your service will return the user which you can then set.

(Declare at top of controller):

init();

function init(){
        loadUserService.loadUser(UserId)
            .then(function (user) {

                 vm.user = user;
                 defer.resolve();

            })
    }

Using a value from a get with ngResource in the controller

2 Answers2