Issue

I have the form with async data:

<form>
 <input [(ngModel)]="currentService.user.username">
 <input [(ngModel)]="currentService.user.email">
</form>

It works only if I add *ngIf="currentService.user" to the form, but I want to render inputs without value before I get data from the server. But I get the following error:

‘Cannot read property ‘username’ of undefined’

How can I solve this? Probably, I need something like async pipe to ngModel, but this does not work, obviously.

Solution

You could Try this out

 <input [(ngModel)]="currentService.user && currentService.user.username">
 <input [(ngModel)]="currentService.user && currentService.user.email">

Working Example