Estoy tratando de eliminar el td en el que se hizo clic con el anguler, pero no funciona, no devuelve nada, solo obtiene los datos. ¿Alguien podría ayudarme y decirme dónde está mi error? Soy nuevo en el uso del anguler. gracias aquí es componente.ts
import { Component, OnInit } from '@angular/core'; import {HttpClient} from '@angular/common/http' @Component({ selector: 'app-home', templateUrl: './home.component.html', styleUrls: ['./home.component.css'] }) export class HomeComponent implements OnInit { dataArray; id; constructor( private http:HttpClient) { this.http.get('https://jsonplaceholder.typicode.com/posts').subscribe( data =>{ this.dataArray = data } ) } ngOnInit(): void { this.delete } delete () { this.http.delete('https://jsonplaceholder.typicode.com/posts/${id}') .subscribe(() => this.id = 'Delete successful'); console.log(this.dataArray) } }aquí está mi tabla:
<div class="table-list"> <table class="table"> <thead> <tr> <th scope="col">Title</th> <th scope="col">Operations</th> </tr> </thead> <tbody> <tr *ngFor="let item of dataArray;" index as i> <td>{{item.title}}</td> <td> <i class="fal fa-check-circle px-2"></i> <i class="fal fa-edit px-2"></i> <button><i class="fal fa-trash-alt" (click)="delete()"></i></button> </td> </tr> </tbody> </table>Tienes que pasar un parámetro a tu función de eliminación:
delete (id: number) { this.http.delete('https://jsonplaceholder.typicode.com/posts/' + id) .subscribe(() => this.id = 'Delete successful'); console.log(this.dataArray)}
En su html, agregue (click)="delete(item.id)
Luego, para eliminar los datos de la matriz, debe ejecutar:
this.array = this.array.filter((d) => d.id !== id));