This code snippet represents my Edit button functionality.
The issue I am facing is that I cannot populate my Form with the correct data from another component. Even when I click the (Edit) button, it retrieves different data but fails to update my form, resulting in it being stuck with the old data. I require assistance in resolving this issue.
public editUser(user: User): void {
var id = user.Id;
localStorage.removeItem("Id");
localStorage.setItem("Id", id.toString());
this.userComponent.openModal("custom-modal",user);
};
Below is a section of code from a separate component related to the Edit button:
ngOnInit() {
var id = localStorage.getItem('Id');
localStorage.removeItem('Id');
if (id) {
this.userService.getById(id).subscribe(res => this.item = res);
console.log(id);
}
this.myGroup = new FormGroup({
Id: new FormControl(),
UserName: new FormControl(),
Password: new FormControl(),
FirstName: new FormControl(),
LastName: new FormControl(),
Email: new FormControl()
});
}
View the output in the browser console after each click on the button: