我有一个我正在写的代码：
login.component.html

<div class="main">
    <div class="image">
        <img src="./assets/icons/login.png" alt="Login">
        <p>Login in to your account</p>
    </div>
        <form [formGroup]="form" class="login" (ngSubmit)="onClick()">
            <p class="error-message" style="font-size: large;" *ngIf="!isValid">Please fill the your info</p>
            <p>Enter your user name and password</p>
            <div class="userName">
                <label for="userName">User name</label>
                <br>
                <input [ngClass]="{'error': emailValidation && !isValid}" type="text" id="userName" placeholder="Your user name" formControlName="email">
                <p class="error-message" *ngIf="emailValidation && !isValid">please enter your user name</p>
            </div>
            <div class="pass">
                <label for="pass">Password</label>
                <br>
                <input [ngClass]="{'error': passwordValidation || !isValid}" type="password" id="pass" placeholder="your password" formControlName="password">
                <p class="error-message" *ngIf="passwordValidation || !isValid">please enter your user password</p>
            </div>
            <button class="btnConfig" id="btnlogin"><img src="./assets/icons/login-btn.png" alt="login"> Login</button>
        </form>             
</div>

login.component.ts:

import { AfterContentChecked, Component, DoCheck, OnChanges, OnInit, SimpleChanges } from '@angular/core';
import { FormGroup, FormBuilder, Validators } from '@angular/forms';
import {  Router } from '@angular/router';

@Component({
  selector: 'app-login',
  templateUrl: './login.component.html',
  styleUrls: ['./login.component.css']
})
export class LoginComponent implements OnInit, DoCheck {
  form!: FormGroup;
  isValid: boolean = true;

  constructor (private formBuilder: FormBuilder, private router: Router) {}

  ngOnInit(): void {
    this.form = this.formBuilder.group({
      email: ['', Validators.required],
      password: ['', Validators.required]
    });

    this.form.valueChanges.subscribe()
  }

  ngDoCheck(): void {
    this.form.valueChanges.subscribe(() => {
      this.isValid = this.form.valid;
    });  
  }

  get emailValidation() {
    return this.form.get('email')?.invalid || this.form.get('email')?.touched;
  }

  get passwordValidation() {
    return this.form.get('password')?.invalid && this.form.get('password')?.touched;
  }

  onClick() {
    if(this.form.valid) {
      this.router.navigate(['/dashboard']);
    } else {
      this.isValid = this.form.valid;
    }
  }
}

Live preview
任何事情都工作正常的验证，直到我按下登录按钮与两个输入字段空的错误消息显示，当我只是填写一个输入的错误消息消失，从两个字段
我尽力了

ngDoCheck(): void {
    this.form.valueChanges.subscribe(() => {
      this.isValid = this.form.valid;
    });  
  }

继续检查，但虫子还是没有