Error Service to render form errrors

error.service.ts

import { HttpErrorResponse } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { FormGroup } from '@angular/forms';
import { Router } from '@angular/router';
import { NzMessageService } from 'ng-zorro-antd/message';

@Injectable({
	providedIn: 'root'
})
export class ErrorService {

	constructor(private message: NzMessageService, private router: Router) { }

	resolveServerErrors(response: HttpErrorResponse, form?: FormGroup) {
		if (response.status === 400 && form) {
			return this.renderFormErrors(form, response)
		}
		else if (response.status === 403) {
			...
		}
		else if (response.status === 404) {
			...
		}
		else if (response.status === 500) {
			...
		}
	}

	renderFormErrors(form: FormGroup, response: HttpErrorResponse) {
		Object.keys(response.error).forEach(prop => {
			const formControl = form.get(prop);
			if (formControl) {
				// activate the error message
				formControl.setErrors({
					serverError: response.error[prop]
				});
			}
		})
		this.message.remove();
		this.message.warning("Resolve form errors & try again!", {nzDuration: 8000})
		if (response.error.non_field_errors) {
			return response.error.non_field_errors
		}
		return undefined
	}
}