How to load current user emberjs

Question

I want to access the current user's information on an account page so it can be edited. I wasn't sure how to fetch the current user, so I set up a route on my server called session.

Accessing '/session' on my server returns a JSON blob, { session: {id: "<guid>"}}, which is the id of the current user in session.

In my ApplicationRoute, I fetch the id, fetch the corresponding user model, and then set the model as the currentUser property on my ApplicationController.

App.ApplicationRoute = Ember.Route.extend({
    setupController: function (controller) {
        var self = this;
        $.getJSON('/session', function (data) {
            if (data && data.session && data.session.id) {
                self.set('controller.currentUser', self.store.find('user', data.session.id));
            }
        });
    }
});

I'm able to access string properties belonging to the currentUser from inside the index template after setting up the IndexController like so:

App.IndexController = Ember.Controller.extend({
    needs: ['application'],
    currentUser: function () {
        return this.get('controllers.application.currentUser');
    }.property('controllers.application.currentUser')
});

That's great, but when I try to set up a multiple value Ember.Select, I get this error:

Assertion Failed: Cannot delegate set('roles', []) to the 'content' property of object proxy <DS.PromiseObject:ember435>: its 'content' is undefined.

I made a jsbin

It demonstrates what I'm trying to do. I'm very confident my error is related to the ajax request, getJSON, because my jsbin example works with localstorage.

How should I be loading the current user? Thanks!

tikotzky · Accepted Answer · 2014-08-08T02:27:42.207

The issue is because self.store.find('user', data.session.id) returns a promise not a record

If you change the code so that you set the currentUser to the record that the promise resolves with (like below) then it works correctly.

App.ApplicationRoute = Ember.Route.extend({
    setupController: function (controller) {
        var self = this;
        $.getJSON('/session', function (data) {
            if (data && data.session && data.session.id) {
                self.store.find('user', data.session.id).then(function(user){
                    // set this in the "then"
                    self.set('controller.currentUser', user);

                    // you should also be able to change the above line to
                    // controller.set('currentUser', user);
                    // because the "controller" is passed in
                });
            }
        });
    }
});

Non working bin: http://emberjs.jsbin.com/xufec/1/edit?js,console,output
Working bin: http://emberjs.jsbin.com/xufec/2/edit?js,console,output

notice the change in the ApplicationRoute from

self.set('controller.currentUser', self.store.find('user', 1));

to

self.store.find('user', 1).then(function(user){
  self.set('controller.currentUser', user);
});

as a side note you should be able to set the current user using

controller.set('currentUser', user);

because the controller is passed in

That seemed to do the trick for me. I started teaching myself about Promises later this evening and figured that was my error. You confirmed it. And thanks for the code cleanup tips. — artburkart, Aug 08 '14 at 03:51

How to load current user emberjs

1 Answers1