How to assign value from array to model - arrays

Question

I have problem with assign from array to model. I want to assign firstName value from userFromDb and assign this value to firstName in model and the same with another values. I don't know how do this :(
User
export interface User{
id:string;
firstName:string;
lastName:string;
email:string;
password:string;
}
UpadateUserComponent.ts
userFromDb: Array<Object>;
model:User = {
id: '',
firstName: '',
lastName: '',
email: '',
password: ''}
ngOnInit() {
let id = this.route.snapshot.paramMap.get('id');
this.userService.getUser(id).subscribe(result => {
console.log(result)
this.userFromDb = result
console.log(this.userFromDb)
});
UpadateUserComponent.html
<div>
<form action="" #f="ngForm" (ngSubmit)="saveUser()" novalidate>
<div>
<label for="firstName">First Name: </label>
<input [(ngModel)]="model.firstName" type="text" id="firstName" name="firstName" placeholder="Name">
</div>
<div>
<label for="lastName">Last Name: </label>
<input [(ngModel)]="model.lastName" type="text" id="lastName" name="lastName" placeholder="Name" >
</div>
<div>
<label for="email">Email: </label>
<input [(ngModel)]="model.email" type="text" id="email" name="email" placeholder="Name" >
</div>
<div>
<label for="password">Password: </label>
<input [(ngModel)]="model.password" type="text" id="password" name="password" placeholder="Name" >
</div>
<button type="submit">Submit</button>
</form>
</div>

Answer 1

I do not know what your database structure looks like, but lets say it is the same as your frontend...
First I am not sure why your userFromDb is an array, would it return more than one user?
If you just want to insert the values then the simplest would be:
this.userService.getUser(id).subscribe(result => {
console.log(result)
this.userFromDb = result
this.model.firstName = this.userFromDB[0].firstName
// same with other values here
console.log(this.userFromDb)
});

Answer 2

this.userService.getUser(id).subscribe(result => {
console.log(result);
this.userFromDb:User = result[0];
console.log(this.userFromDb);
});
HTML
<div>
<form action="" #f="ngForm" (ngSubmit)="saveUser()" novalidate>
<div>
<label for="firstName">First Name: </label>
<input [(ngModel)]="userFromDb.firstName" type="text" id="firstName" name="firstName" placeholder="Name">
</div>
<div>
<label for="lastName">Last Name: </label>
<input [(ngModel)]="model.lastName" type="text" id="lastName" name="lastName" placeholder="Name" >
</div>
<div>
<label for="email">Email: </label>
<input [(ngModel)]="userFromDb.email" type="text" id="email" name="email" placeholder="Name" >
</div>
<div>
<label for="password">Password: </label>
<input [(ngModel)]="userFromDb.password" type="text" id="password" name="password" placeholder="Name" >
</div>
<button type="submit">Submit</button>
</form>
</div>