Question

我正在尝试使用2个验证器（与Validators.compose([])组合的模式来验证用户的输入但是然后在HTML中，我试图进行验证，但无法正常工作这是代码：

component.ts

...
searchForm: FormGroup;

  constructor(
    private data: DataSharingService,
    private router: Router
  ){ }

  ngOnInit() {
    this.createSearchForm();
    this.newMessage()
  }

  private createSearchForm(): void {
    this.searchForm = new FormGroup({
      emailFormControl: new FormControl('', Validators.compose([
        Validators.pattern['/^[a-zA-Z]{2}[0-9]{6}/'],
        Validators.pattern['/^[0-9]{10}/']
      ]))
    });
  }
...

component.html

<form class="mainContainer" [formGroup]="searchForm">
<mat-form-field class="searchfield">
  <input matInput placeholder="Type in tax payer ID or initials " 
        formControlName="emailFormControl"
        i18n-placeholder="@@SearchPeHint">
  <mat-error *ngIf="searchForm.controls['emailFormControl'].hasError('required')" i18n="@@SearchPeParamsRequired">
       Tax payer ID or initials are required!
  </mat-error>
</mat-form-field>

Answer 1

您不必使用Validators.compose([])。如果出现错误，请检查searchForm.controls['emailFormControl'].hasError('required')"，但emailFormControl没有必需的验证器。

About Validators.compose()

验证器撰写的角度似乎不起作用

1 个答案: