Нужно показать сообщение об ошибке в mat errror, основываясь на условии if в компоненте - PullRequest
Новая
       39

Нужно показать сообщение об ошибке в mat errror, основываясь на условии if в компоненте

0 голосов
/ 09 января 2020

Я хочу показать сообщение об ошибке в матричной ошибке на основе условия if в компоненте. 

export class EditMaterialComponent implements OnInit {

  public quantityRemaining:any;
  public editMaterialForm = new FormGroup({
    count: new FormControl(''),
    suppliedTo: new FormControl('')
  })
  public errormatcher = new MyErrorStateMatcher();
  constructor(private dialogRef: MatDialogRef<EditMaterialComponent>,@Inject(MAT_DIALOG_DATA) public dialogData: any,private inventoryMngService:InventoryMngService) { }

  ngOnInit() {
    console.log(this.dialogData);

  }


  /** CLOSE mat dialog **/
  close() {
    this.dialogRef.close(null);
  }
  updateQuantity(){

    this.dialogData.count = this.dialogData.count - this.editMaterialForm.value.count;
    this.dialogData.comment = this.editMaterialForm.value.suppliedTo;
    if(this.editMaterialForm.valid){
     this.inventoryMngService.updateICase(this.dialogData).subscribe(res=>{
       console.log(res);
       this.close();
      },err=>{
        console.log(err);
      })
    }

}
}

В updateQuantity(), если this.editMaterialForm.value.count > this.dialogData.count, необходимо отобразить ошибку в <mat-error></mat-error>. Может кто-нибудь помочь мне решить эту проблему?

1 Ответ

0 голосов
/ 09 января 2020

Вы можете использовать пользовательский валидатор, например так: 

export const validateCondition = (condition: (control: AbstractControl) => boolean, errorString: string): ValidatorFn => 
  (control: AbstractControl): ValidatorErrors =>
  (condition(control) ? null : { [errorString]: { value: control.value } });

Вы можете использовать его так: 

editMaterialForm = new FormGroup({
  count: new FormControl('', [validateCondition(control => control.value > this.dialogData.count, 'myCustomError')]),
  suppliedTo: new FormControl('')
})

Затем в вашем HTML: 

<mat-error *ngIf="FormControl.hasError('myCustomError')">message</mat-error>
...