Асинхронные данные не видны в форме
День добрый, вот моя проблема.
В проекте Angular 7 при переходе на страницу компонента производится асинхронное подчитывание данных, которое выводятся в инпуты. После получения данных они корректно отображаются в полях ввода, но при отправке на сервер получается что значения value пустые. Кроме того, несмотря то что значения отображены в полях валидаторы выдают ошибки словно поля пустые. Если поставить курсор в поле ввода и добавить символ, новое полное значение становится доступным для компонента поля ввода и валидатора. Подскажите как правильно воткнуть данные в форму. <form [formGroup]="emplForm" (ngSubmit)="FormSubmit()"> <mat-form-field> <mat-label>Логин</mat-label> <input formControlName="login" matInput [value]="user.login"> </mat-form-field> <mat-form-field> <mat-label>Ф.И.О.</mat-label> <input formControlName="full_name" matInput [value]="user.full_name"> </mat-form-field> <button type="submit" mat-flat-button color="primary">Сохранить</button> <form/> user: IUserCard = new UserCard(<IUserCard>{}); emplForm: FormGroup; constructor() { public route: ActivatedRoute, public router: Router, } ngOnInit() { this.emplForm = new FormGroup({ full_name: new FormControl(null, [Validators.required]), login: new FormControl(null, [Validators.required]), }); this.ctrl = this.emplForm.controls; this.currId = this.route.snapshot.queryParams["id"]; if (this.currId !== undefined) { this.userService.getUser(+this.currId) .subscribe((data: IUserCard) => { this.user = new UserCard(data); }); } } |
либо
<input formControlName="login" matInput [ngModel]="user.login" /> либо так <input formControlName="login" matInput /> this.userService.getUser(+this.currId) .subscribe((data: IUserCard) => { const user = new UserCard(data); this.emplForm.get('login').setValue(user.login); this.emplForm.get('full_name').setValue(user.full_name); }); |
[ngModel] -- в 6 версии deprecated, а в 7 -- закрыт.
Второй вариант да, его и прицепил, но как-то не изящно. :о( |
Цитата:
Но вообще да, раз ты выбрал reactive forms то и иди этой дорогой. |
Часовой пояс GMT +3, время: 17:16. |