An Angular Class tool to compare an initial object with another modified version of itself.
<form[formGroup]="form"><div><h2>Edit user</h2></div><div><label>First name</label><inputtype="text"formControlName="firtname"></div><div><label>Last name</label><inputtype="text"formControlName="lastname"></div><div><label>Email</label><inputtype="text"formControlName="email"></div><div><buttontype="button"[disabled]="!hasChanges()"(click)="restore()">Cancel</button><buttontype="button"[disabled]="!hasChanges()"(click)="submitUser()">Submit</button></div></form>
privatefb=inject(FormBuilder);privateroute=inject(ActivatedRoute);privateco!:CompareObject;form:FormGroup;@Input() id:string;ngOnInit(){if(this.id){this.getInfo(this.id);}}privategetInfo(id:string){this.http.get('https://example.com/users/'+id).subcribe((response)=>{this.initForm(response.user);})}privateinitForm(user:IUser){this.form=this.fb.group({firstname:[user.firstname,Validators.required],lastname:[user.lastname,Validators.required],email:[user.email,Validators.required]});constoriginalForm=this.form.value();this.co=newCompareObject(originalForm);}hasChanges(): boolean{if(!this.co)return;constform=this.form.value();return!this.co.isSame(form);}privaterestore(){this.form.reset(this.co.getOriginal());}submitUser(){if(this.hasChanges()){//do something}}cancelSubmit(){this.restore();}
