El problema que sufres es debido a que el contenido de la variable `DataUser` no se definirá hasta que se resuelva la promesa, por lo que no podrás acceder a sus propiedades hasta entonces. Una manera de resolver este problema es accediendo a la información únicamente cuando ésta llegue usando [`async`](https://angular.io/api/common/AsyncPipe): <div class="data-user" *ngIf="DataUser | async as dataUser"> <span>{{ dataUser.nombre }} </span> <span>{{ dataUser.apellido }} </span> </div> Nota que el nombre de la variable ha cambiado de `DataUser` a `dataUser`. Otra forma de hacerlo es a través de un valor inicial: ngOnInit(): void { /* Valor inicial hasta que lleguen los datos */ this.DataUser = { nombre: '-', apellidos: '-' }; //TRAER LOS DATOS DEL USUARIO EN SESION this.user.userData() .subscribe( res =>{ this.DataUser = res }, err =>{ console.log(err); } ); } Una tercera forma de solucionar el problema, aunque no te recomiendo acostumbrarte a ella, es hacer uso del [operador de navegación segura (`?`)](https://angular.io/guide/template-syntax#safe-navigation-operator) para detectar la disponibilidad del dato: <div class="data-user" *ngIf="DataUser | async as dataUser"> <span>{{ (DataUser | async)?.nombre }} </span> <span>{{ (DataUser | async)?.apellido }} </span> </div>