angular - “异或”中的 FormGroup 验证

Question

我有一个由 3 个输入字段组成的 FormGroup：reservationCode、secretCode 和条形码。

字段条码就是reservationCode + '-' + secretCode。（这是因为条形码是一个可以在文本中找到的字段，并且可以与复制+粘贴功能一起使用）

现在，使用这些字段的按钮只有在条形码有值或者reservationCode 和secretCode 有值时才必须处于活动状态。

逻辑应该类似于：“barcode || reservationCode && secretCode”

这是我的 .ts 中的 formGroup 的代码：

 this.voucherVerifyUserDataFormGroup = formBuilder.group({
  reservationCode: [''],
  secretCode: [''],
  barcode: ['']
});

我不知道如何管理 formControl 验证器以及是否必须创建自定义验证器。

Answer 1

Try this : 

    this.voucherVerifyUserDataFormGroup.valueChanges.subscribe((form : any) =>{
     //check your condition : 

    if(form.barcode != '' || (form.reservationCode != '' && form.secretCode != '')){
     this.voucherVerifyUserDataFormGroup.setErrors(null);
    }
    else
    {
     this.voucherVerifyUserDataFormGroup.setErrors({ 'invalid': true});
    }
    })

Answer 2

您可以使用 *ngIf/disabled 来实现。

<input type="button" *ngIf="isDataPresent" value="Paste">

零件：

get isDataPresent(){
  return this.voucherVerifyUserDataFormGroup.get('barcode').value || (this.voucherVerifyUserDataFormGroup.get('reservationCode').value && this.voucherVerifyUserDataFormGroup.get('secretCode').value);
}