Всем привет. В форму после загрузки неправильно вставляются данные:
Здесь мы видим 3-и поля с одинаковым текстом.
component:
import { Component, OnInit } from "@angular/core";
import { UserInfoService } from "src/app/services/dataHome.service";
import { SettingUserService, UpdatedUserInfo } from "src/app/services/settingsUser.service";
@Component({
selector: 'updateProperties-form',
templateUrl: 'updateProperties.component.html'
})
export class UpdatePropertiesComponent{
constructor(
private settingsService: SettingUserService,
public updatedUserInfo: UpdatedUserInfo,
public userInfo: UserInfoService){
}
ngOnInit()
{
this.updatedUserInfo.EmailAddress = this.userInfo.emailAddress
this.updatedUserInfo.Telegram = this.userInfo.telegram
this.updatedUserInfo.Username = this.userInfo.username
console.log(this.userInfo.telegram);
}
public updateUserInfo()
{
var result = this.settingsService.updateUserInfo(this.updatedUserInfo);
console.log(result);
}
}
html:
<form action="properties">
<div class="col-md-5">
<label for="inputEmail4">Email Address</label>
<input [(ngModel)]="updatedUserInfo.EmailAddress" #updatedEmail="ngModel" type="email" class="form-control" id="inputEmail4" placeholder="Email" value="{{updatedUserInfo.EmailAddress}}">
</div>
<div class="col-md-5">
<label for="telegram">Telegram</label>
<input [(ngModel)]="updatedUserInfo.Telegram" type="text" class="form-control" placeholder="Telegram login" value="{{updatedUserInfo.Telegram}}">
</div>
<div class="col-md-5">
<label for="name">Name</label>
<input [(ngModel)]="updatedUserInfo.Username" #updatedUsername="ngModel" type="text" class="form-control" placeholder="Name" value="{{updatedUserInfo.Username}}">
</div>
<button (click)="updateUserInfo()" type="button" class="btn btn-primary mt-2">Save</button>
</form>
скриншот консоли с выводом значения telegram:
Как видно в ngonInit в данные класса присваиваются разные значения. С сервера они то же приходят разные, и в клиенте они то же разные, я проверял. Однако в форме все значения одинаковые. В чём проблема?
[value]
можете убрать, из ngOnInit перенести в конструктор, добавить вездеname="..."
, и заменитьthis.updatedUserInfo = { ... this.userInfo }