joydip.manna/ekart
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Show server side validation errors

Browse Source
This commit is contained in:
kusowl 2026-02-23 12:17:14 +05:30
parent 2ca605feb4
commit 77532aaac2
2 changed files with 36 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/app/features/auth/components/register/register.html
View File

@ -1,10 +1,16 @@
<section class="my-10 sm:my-30 flex flex-col sm:flex-row space-x-20 justify-center items-center"> <section class="my-10 md:my-30 flex flex-col md:flex-row space-x-20 space-y-10 justify-center items-center">
<article class="space-y-6"> <article class="space-y-6">
<h1 class="text-3xl text-gray-800 font-space font-bold">Register</h1> <h1 class="text-3xl text-gray-800 font-space font-bold">Register</h1>
<h2 class="text-xl text-gray-600">Sign up with your<br/>email address to get started</h2> <h2 class="text-xl text-gray-600">Sign up with your<br/>email address to get started</h2>
<div class="text-xs text-red-600 space-y-2">
@for (error of errors(); track error) {
<p>{{ error }}</p>
}
</div>
</article> </article>
<form [formGroup]="registerForm" (ngSubmit)="registerUser()" class="card max-w-11/12 sm:max-w-8/12 grid md:grid-cols-2 gap-4"> <form [formGroup]="registerForm" (ngSubmit)="registerUser()"
class="card max-w-11/12 sm:max-w-8/12 grid md:grid-cols-2 gap-4">
<article class="space-y-4"> <article class="space-y-4">
<fieldset class="fieldset"> <fieldset class="fieldset">
<legend class="fieldset-legend">Name</legend> <legend class="fieldset-legend">Name</legend>

13
src/app/features/auth/components/register/register.ts
View File

@ -1,4 +1,4 @@
import { Component, inject } from "@angular/core"; import {Component, inject, signal} from "@angular/core";
import {FormControl, FormGroup, ReactiveFormsModule} from "@angular/forms"; import {FormControl, FormGroup, ReactiveFormsModule} from "@angular/forms";
import {AuthService} from "../../services/auth-service"; import {AuthService} from "../../services/auth-service";
import {RegisterUserRequest} from "../../../../core/models/user.model"; import {RegisterUserRequest} from "../../../../core/models/user.model";
@ -12,6 +12,7 @@ import { RegisterUserRequest } from "../../../../core/models/user.model";
export class Register { export class Register {
authService = inject(AuthService); authService = inject(AuthService);
errors = signal<string[]>([]);
registerForm = new FormGroup({ registerForm = new FormGroup({
name: new FormControl(''), name: new FormControl(''),
@ -24,7 +25,15 @@ export class Register {
registerUser() { registerUser() {
this.authService.register(this.registerForm.value as RegisterUserRequest) this.authService.register(this.registerForm.value as RegisterUserRequest)
.subscribe(); .subscribe({
next: () => console.log('success'),
error: (error) => {
const errors: Record<number, string[]> = error?.error?.errors || {};
const errorMessages :string[] = Object.values(errors).flat();
this.errors.set(errorMessages) ;
}
});
} }
} }