No value accessor for form control with
Вообщем пишу приложение ну точнее переписываю html, ну не важно и вот такая ошибка ERROR Error: No value accessor for form control with name: 'password' в консоли, само приложение запускается, но обработчик поля не робит. Вот вид:
<StackLayout class="nt-form" [formGroup]="signForm" (ngSubmit)="onSubmit(signForm.value)">
<StackLayout class="nt-input">
<Label text="{{ 'Email' | translate }}" class="nt-label"></Label>
<TextField required hint="{{ 'Email' | translate }}" formControlName="email" keyboardType="email" text="">
</TextField>
<Label class="mat-error" *ngIf="checkError('email')" text="{{ getErrors('email') }}">
</Label>
</StackLayout>
<StackLayout class="nt-input">
<Label text="{{ 'Password' | translate }}" class="nt-label"></Label>
<TextField required hint="{{ 'Password' | translate }}" formControlName="password" secure="true" text="">
</TextField>
<Label class="mat-error" *ngIf="checkError('password')" text="{{ getErrors('password') }}"></Label>
</StackLayout>
<StackLayout class="nt-input">
<Button type="submit" [disabled]="!signForm.valid" text="{{ 'Sign in' | translate }}"></Button>
</StackLayout>
</StackLayout>
<ActivityIndicator [busy]="isBusy"></ActivityIndicator>
</StackLayout>
Вот код ts:
export class SigninComponent implements OnInit {
isBusy: boolean = true;
signForm: FormGroup;
errors: Array<FieldError> = [];
constructor(private api: ApiService, private customValidator: CustomValidator, private router: Router) {}
ngOnInit() {
this.signForm = new FormGroup({
email: new FormControl(null, [Validators.required, Validators.email]),
password: new FormControl(null, [Validators.required])
});
this.isBusy = false;
}
onSubmit(value: any) {
this.errors = [];
this.isBusy = true;
this.api.login(value).subscribe((res) => {
if (res instanceof ApiError) {
this.errors = res.error;
this.isBusy = false;
} else {
this.isBusy = false;
this.router.navigate(['/payment']).then(() => {});
window.postMessage({
type: 'LoginSuccess',
text: 'Login'
}, '*');
}
});
}
getErrors(fieldName: string): string {
const errors = this.signForm.get(fieldName).errors;
const key = Object.keys(errors)[0];
return this.customValidator.errorMap[key] ? this.customValidator.errorMap[key] : '';
}
checkError(fieldName: string) {
return !!this.signForm.get(fieldName).errors;
}
}
Ответы (1 шт):
Автор решения: Татьяна Компаниец
→ Ссылка
formControlName можно использовать только на инпутах вроде.
Так как у вас formControlName применяется к TextField, скорее всего, вам нужно будет использовать интерфейс CustomValueAccessor. Ну или форму делать через [(ngModel)].