I have a resolver that looks like this:

import { Injectable } from '@angular/core';
import { Resolve, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
import { HttpClient } from '@angular/common/http';

import { Observable } from 'rxjs';

import { User } from './user';

@Injectable()
export class UserResolver implements Resolve<User> {

    constructor(private httpClient: HttpClient) {}

    resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<User> {
        const userId = +route.params['userId'];
        return this.httpClient.get<User>('/api/user/single/userId/' + userId);
    }
}

I'm using it like this in a RouterModule:

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { SmsComponent } from './sms.component';
import { SmsSentComponent } from './sms-sent/sms-sent.component';
import { SmsNewComponent } from './sms-new/sms-new.component';
import { SmsPlannedComponent } from './sms-planned/sms-planned.component';

import { UserResolver } from '../users/user.resolver';

const routes: Routes = [
    {
        path: '',
        component: SmsComponent,
        children: [
            { path: 'sent', component: SmsSentComponent },
            // https://stackoverflow.com/questions/34208745/angular-2-optional-route-parameter
            { path: 'new/:userId', component: SmsNewComponent, resolve: { user: UserResolver } },
            { path: 'new', component: SmsNewComponent },
            { path: '', component: SmsPlannedComponent }
        ]
    }
];

@NgModule({
    imports: [RouterModule.forChild(routes)],
    exports: [RouterModule],
    providers: [
        UserResolver
    ]
})
export class SmsRoutingModule { }

And then I fetch the user inside ngOnInit() inside a component like this:

this.activatedRoute.data
    .subscribe((user: User) => {
        console.log(user);
    });

When I console.log the user it seems to work, but if I console.log this:

this.activatedRoute.data
    .subscribe((user: User) => {
        console.log(user.cellphone);
    });

Then I get undefined. It seems like the User is not ready when I run the console.log, is it not the whole point of resolving to have it ready when component loads? How can I have the User Object ready inside ngOnInit() as expected?

This is the User class by the way:

export class User {
    constructor(
        public id: number = 0,
        public email: string = '',
        public firstname: string = '',
        public lastName: string = '',
        public cellphone: string = '',
        public companyName: string = '',
        public address: string = '',
        public hasHeating: boolean = false,
        public heatingLastService: string = '',
        public createdTime: number = 0,
        public isCreatedByAdmin: boolean = false,
        public isDeleted: boolean = false
    ) { }
}