Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Como valido a resposta do meu componente de busca?

Estive praticando e fiz a seguinte busca com informações que vieram de uma API: --- Ao inserir o ID eu recebo o resultado da lista na tela. Queria saber como faço caso coloque no input um id que não exista para inserir um alert por exemplo e se deixar o campo em branco.

Tenho a service que traz os produtos pelo id da API

listarProdutos(id: number):Promise<IResponse<any>>{ return this.http.get<IResponse<any>>(`mercado/produto/${id}`).toPromise(); } E o component que está recebendo está da seguinte forma:

public produtos: ProdutosModel[] = [];

ngOnInit(): void{}

construtor(private produtoService: ProdutoService){}

listarProdutos(id){
  this.produtoService.listarProdutos(id).then(response => {
    this.produtos = response.data;
  });
}

buscar(id: any){
  let _id = id.value;

  this.listarProdutos(_id);
}

E o HTML está assim:

<input type="text" #ID> <button (click)="buscar(ID)">Buscar</button>

<table *ngFor="let produtos of produtos">
<tr>
<td>id</td>
<td>nome</td>
<td>data vencimento</td>
</tr>
<tr>
<td>{{produtos.id}}</td>
    <td>{{produtos.nome}}</td>
    <td>{{produtos.dataVencimento}}</td>
</tr>

Também tenho a model

export class ProdutosModel{
id: number;
nome: string;
dataVencimento: string
}
1 resposta
solução!

Olá Jéssica

Na questão do ID não existente> Como não sei se o back está tratando, dá pra tentar realizar pela resposta do http caso não retorne nenhuma ID:

if(retorno.data !== null || retorno.data !== undefined){ alert('Nenhum encontrado'); }

Caso esteja tratando o retorno do http:

if (retorno.status === 200) { //Tem retorno, fluxo normal } else { //se tiver tratando no backend o retorno será null }

Se o campo estiver vazio adicione no buscar(id: any){ let id = id.value; if (!id) alert('Digite o ID do produto'); else this.listarProdutos(_id); }