要解决Angular 9中在OnInit时表单无效的问题,可以使用以下方法:
import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
export class YourComponent implements OnInit {
form: FormGroup;
constructor(private formBuilder: FormBuilder) { }
ngOnInit() {
this.form = this.formBuilder.group({
// 在此处添加表单控件
});
}
}
import { Component, OnInit, AfterViewInit, ViewChild, ElementRef } from '@angular/core';
export class YourComponent implements OnInit, AfterViewInit {
form: FormGroup;
@ViewChild('inputField') inputField: ElementRef;
constructor(private formBuilder: FormBuilder) { }
ngOnInit() {
this.form = this.formBuilder.group({
// 在此处添加表单控件
});
}
ngAfterViewInit() {
// 监听输入框的值变化
this.inputField.nativeElement.addEventListener('input', () => {
// 在此处执行表单验证逻辑
});
}
}
通过以上步骤,你可以解决Angular 9中在OnInit时表单无效的问题,并且能够在浏览器自动填充输入时正确验证表单。