How to Angular Connect Service Html Show Data?

export class UserService {
private apiUrl = `${environment.apiUrl}Users`;
constructor(private http: HttpClient) {}

getUsers(): Observable<any>{
return this.http.get(this.apiUrl);
}

updateUser(UserId: number, fromData: FormData): Observable<any>{
return this.http.put<any>(`${this.apiUrl}/${UserId}`,fromData);
}

deleteUser(id: number): Observable<any>{
return this.http.delete(`${this.apiUrl}/${id}`);
}
}


Service How i can edit code some people help me
-----------------------------------------------------------



<div class="popup" *ngIf="showEditPopup">
<div class="popup-content">
<span class="close" (click)="closeEditPopup()">&times;</span>
<h2>Edit User</h2>

<label for="name">User Name:</label><br>
<input type="text" [(ngModel)]="currentUser.name"><br>

<button (click)="updateUser()">Save</button>
</div>
</div>

<button (click)="openEditPopup(User)">Edit</button>
<button (click)="deleteUser(User.id)">Delete</button>



Pop Up
-------------------------------------------



openEditPopup(User: any): void {
this.currentUser = { ...User };
this.showEditPopup = true;
}

closeEditPopup(): void {
this.showEditPopup = false;
}

addUser(): void{
const fromData = new FormData();
fromData.append('User[name]',this.currentUser.name);

this.UserService.addUser(fromData).subscribe(
(data) => {
this.getUser();
},
(error) => {
console.error('error add User')
}
);
}

updateUser(): void {
const fromData = new FormData();
fromData.append('User[name]', this.currentUser.name);

this.UserService.updateUser(this.currentUser.id, fromData).subscribe(
(data) => {
this.getUser();
this.closeEditPopup();
},
(error) => {
console.error('Error updating User', error);
}
);
}

onImageUpload(event: any): void {
const file = event.target.files[0];
if (file) {
this.selectedImage = file;
}
}

deleteUser(id: number): void{
this.UserService.deleteUser(id).subscribe(
(data) => {
this.getUser();
},
(error) => {
console.error('error delete User')
}
);
}
}


TS Angular
-------------------------------------------------
How i can edit code some people help me pls How i can edit code some people help me pls
How i can edit code some people help me pls How i can edit code some people help me pls

Continue reading...