angular material mat-error on http request
// first define our formcontrol object
control = new FormControl('', [Validators.required])
//http method:
submit() {
//call api
// assume you got an error (Unauthorized, BadRequest, ...)
//this set control to errored status and thus,
//mark formcontrol/formgroup as invalid
this.control.setErrors({error_key: true})
}
// in your html code :
<mat-form-field>
<mat-label>Control</mat-label>
<input type="text" formControlName="control" matInput />
<mat-error *ngIf="control.hasError('required')">
Control cannot be empty
</mat-error>
<mat-error *ngIf="control.hasError('error_key')">
My custom error message
</mat-error>
</mat-form-field>