Dev (Back & Front)ARTIGO
Angular – Excluindo dados da API
Olá pessoal, o artigo de hoje será bem curto, vamos deletar um item da nossa lista usando o método HTTP.
Alef BacelarAutor
22 de outubro de 2025 às 08:19
1 min de leitura
Olá pessoal, o artigo de hoje será bem curto, vamos deletar um item da nossa lista usando o método HTTP.
Primeiro vamos no nosso “SERVICO.TS”, e adicionar o seguinte código.
//DELETE EXCLUIR DADOS DA API
delete(id: any) {
return this.http.delete<any>(`http://localhost:3000/produtos/${id}`)
}Agora no nosso “COMPONENT.TS” criaremos nossa função de deletar.
//DELETE
deletar(id: any) {
this.serviceCrud.delete(id).subscribe(() => {
this.getLista();
});
}Agora é só chamar a função deletar no nosso component.html, passando o id dos itens.
<tr *ngFor="let items of lista">
<td>{{items.nome}}</td>
<td>{{items.descricao}}</td>
<td>
<button class="btn btn-warning" (click)="editar(items)">Editar</button>
{{''}}
<button class="btn btn-danger" (click)="deletar(items.id)">Deletar</button>
</td>E assim vai ficar o nosso delete.
Por fim nosso crud está concluído. Repositório do projeto no meu GIT HUB: https://github.com/Alefbacelar/Project-crud-Angular.
