我正在使用Angular React式表单验证，在通过触摸验证后，名称输入仍停留在待处理状态
我找不到代码本身的任何问题，也找不到为什么name输入会这样做，而其他带有验证的输入都很好
这是在ts文件中：

ngOnInit(): void {
    this.signupForm = this.formBuilder.group({
      name: [
        '',
        [
          Validators.required,
          Validators.minLength(3),
          Validators.pattern('^[a-zA-Z ]*$'),
        ],
      ],
      familyName: [
        '',
        [
          Validators.required,
          Validators.minLength(3),
          Validators.pattern('^[a-zA-Z ]*$'),
        ],
      ],
      number: [
        '',
        Validators.required,
        Validators.pattern('[0-9]{3} [0-9]{3} [0-9]{3}'),
      ],
      email: ['', [Validators.required, Validators.email]],
      password: [
        '',
        [
          Validators.required,
          Validators.pattern('^(?=.*?[A-Z])(?=.*?[a-z])(?=.*?[0-9]).{8,}$'),
        ],
      ],
    });
  }

HTML文件：

<div class="container">
  <form [formGroup]="signupForm" (ngSubmit)="onSubmit()">
    <label for="name">Name </label>
    <input
      formControlName="name"
      type="text"
      name="name"
      id="name"
      placeholder="Name"
    />
    <div class="alert-danger" *ngIf="name?.touched && name?.invalid">
      Name is not valid
    </div>
    <label for="familyName">Family Name </label>
    <input
      formControlName="familyName"
      type="text"
      name="familyName"
      id="familyName"
      placeholder="Family Name"
    />
    <div
      class="alert-danger"
      *ngIf="familyName?.touched && familyName?.invalid"
    >
      Family Name is not valid
    </div>
    <label for="number">Phone number </label>
    <input
      formControlName="number"
      type="text"
      name="number"
      id="number"
      placeholder="Phone number"
    />
    <div class="alert-danger" *ngIf="number?.touched && number?.invalid">
      Phone Number is not valid
    </div>
    <label for="email">Email </label>
    <input
      formControlName="email"
      type="text"
      name="email"
      id="email"
      placeholder="email"
    />
    <div class="alert-danger" *ngIf="email?.touched && email?.invalid">
      Email is not valid
    </div>
    <label for="password">Password </label>
    <input
      formControlName="password"
      type="text"
      name="password"
      id="password"
      placeholder="password"
    />
    <div class="alert-danger" *ngIf="password?.touched && password?.invalid">
      Password should have minimum 8 characters, at least 1 uppercase letter, 1
      lowercase letter and 1 number
    </div>
    <input class="submit-btn" type="submit" />
  </form>
</div>

并在控制台中写上一个字母后在名字中输入：

<input _ngcontent-sfk-c51="" formcontrolname="productName" type="text" productname="productName" id="productName" placeholder="productName" ng-reflect-name="productName" class="ng-touched ng-dirty ng-pending">