2017-04-05 25 views
1

これはAngular2を使用してテーブルからユーザーの行を削除する方法は?

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

バックエンドサーバを呼び出し、これは、グリッド上のユーザーのリストを表示 userComponentあるユーザサービスの deleteUser機能です。 私はあなたが現在のオブジェクトのインデックスを宣言し、「ユーザー」オブジェクトから項目を削除したい場合は「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( ); 
    } 

} 

答えて

2

をクリックすることで、ユーザーを削除したいです。

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

次に、あなたのおかげでそれが動作仲間このインデックスに

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

を使用して、あなたのコレクションからスプライスすることができます –

関連する問題