how to delete a row of user from table using Angular2?

Question

This is the deleteUser function of user service which call the backend server

 deleteUser(id:number)
 {
     return this.http.delete(`${this.Url}/${id}`)
 }

and this is the userComponent which display the list of users on a grid. I want to delete user by clicking on 'supprimer'

@Component({
    template: <ul *ngFor=" let x of users">
            <li>{{x.id}}</li>
            <li>{{x.firstName}}</li>
            <li>{{x.lastname}}</li>
            <li>{{x.username}}</li>
            <li>{{x.password}}</li>
            <li><a (click)="deleteItem(x.id)">supprimer</a></li>
        </ul>
})

export class UserListComponent implements OnInit {
    private users: User[];

    constructor(private userService: UserService ,private router:Router) { }
    ngOnInit() {
        his.userService.getAllUsers().subscribe(data => {this.users = data })
    }

    deleteItem(id:number) {
        this.userService.deleteUser(id).subscribe(   );
    }

}

Nicolas Law-Dune · Accepted Answer · 2017-04-05 16:44:34Z

2

If you want to remove an item from "users" object, declare an index of the current object.

<ul *ngFor=" let x of users; let i = index;">
   <li><a (click)="deleteItem(x.id, i)">supprimer</a></li>
</ul>

Then you can splice from your collection using this index

  deleteItem(id:number, index:number) {
    this.userService.deleteUser(id).subscribe(response =>{
         this.users.splice(index, 1);
    });
 }

edited Apr 5, 2017 at 16:44

answered Apr 5, 2017 at 16:38

Nicolas Law-Dune

1,7132 gold badges13 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

jannej · Accepted Answer · 2021-12-19 21:45:02Z

0

user Service:  
DeleteUser(_id:any){
    return this.httpClient.delete<any>(`${environment.APIURL}/users/${_id}`,this.options)
    .pipe(map((res:any)=>{
      return res
    }))
  }

user Component.ts:
 DeleteUser(user: any) {
    this._userservice.DeleteUser(user._id).subscribe(res => {}`enter code here`

edited Dec 19, 2021 at 21:45

jannej

92615 silver badges28 bronze badges

answered Dec 19, 2021 at 11:35

Yassin Mo

6122 gold badges5 silver badges12 bronze badges

Collectives™ on Stack Overflow

how to delete a row of user from table using Angular2?

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related