Cześć. Stworzyłem tabelkę z danymi oraz button który je usuwa. Jak mogę zrobić aby po każdym usunięciu tabelka się odswierzyła i znikł wiersz z usuniętymi danymi ? :)
0
2
// on click
removeProduct(id: string) {
const indexToRemove = this.products.findIndex(p => p.id === id);
this.products.splice(indexToRemove, 1);
}
0
Tak wygląda company-list.ts
data: Company[];
constructor(private service: CompanyService) { }
ngOnInit() {
this.service.getCompaniesList().subscribe(result => {
this.data = result;
console.log(this.data);
});
}
changeStatus(name) {
this.service.changeStatus(name).subscribe(result => { console.log(result); });
}
deleteCompany(id) {
this.service.deleteCompany(id).subscribe();
const indexToRemove = this.data.findIndex(p => p.id === id);
this.data.splice(indexToRemove, 1);
}
a tutaj jest html :
<header class="text-center mb-5">
<h1>Pracodawcy</h1>
</header>
<table class="table table-dark table-hover text-center">
<thead>
<tr>
<th scope="col">Nazwa</th>
<th scope="col">Adres</th>
<th scope="col">NIP</th>
<th scope="col">Ilość ofert</th>
<th scope="col">Status</th>
<th scope="col">Ustawienia</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let item of data">
<td>
{{item.name}}
</td>
<td>
{{item.address}}
</td>
<td>
{{item.nip}}
</td>
<td>
{{item.tenureCount}}
</td>
<td>
<label><input (click)="changeStatus(item.name)" type="checkbox" class="ios-switch bigswitch" [checked]="item.isActive" /><div><div></div></div></label>
</td>
<td>
<button (click)="deleteCompany(item.id)" class="button button-delete mr-2"><i class="far fa-trash-alt"></i></button>
</td>
</tr>
</tbody>
</table>
1
Na początek wrzuciłbym kod usuwający wewnątrz subscribe
.
Ok, mój błąd wygląda na to, że https://stackoverflow.com/questions/47693951/why-is-not-updated-model-in-ngfor-after-changed-model
Spróbuj
deleteCompany(id) {
this.service.deleteCompany(id).subscribe(() => {
this.data = this.data.filter(d => d.id !== id);
});