angular - 如何以角度有条件地触发验证检查

Question

我有一个Angular 8应用程序。它有一个捕捉电影和门票的表格。

模型定义

export class Movie
{
  name:string;
}

export class Ticket
{
   name:string;
   price:number;
}

使用 Reactive Form 构建如下表单。

  public buildForm(): FormGroup {
    return this.form = this.fb.group({
        /* primary */
        'name': ['', [Validators.required, Validators.minLength(3)]],
        /* tickets*/
        'tickets': this.fb.array([this.buidTicketForm()])
    })
  }

  public buidTicketForm(): FormGroup {
    return this.fb.group({
        'name': ['',[Validators.required, Validators.minLength(3)]],
        'price': [0.00,[Validators.required, Validators.min(0.00)]],
    })
}

现在我的要求是与票证相关的验证应该有条件地触发。

好像票证验证仅在票证名称不为空时才应运行，否则无需检查验证。

谢谢！

Answer 1

您可以构建自定义验证器或制作如下条件方法：

  private setValidators(formKey: string) {
    if (this.form.get('name').value !== null) {
      return [
        Validators.required,
        formKey === 'name' ? Validators.minLength(3) : Validators.min(0.00)
      ];
    }

接下来将其应用于您的表单生成器：

public buidTicketForm(): FormGroup {
  return this.fb.group({
      'name': ['',this.setValidators('name')],
      'price': [0.00,this.setValidators('price')],
  });
}