Angular Get Consumindo API
#Parte5 #Crud #GET
Olá pessoal, hoje iremos fazer um get para pegar as informações da nossa lista na API REST que simulei no ultimo artigo, para quem não sabe como simular segue o link abaixo:
Agora vamos abrir nosso projeto angular, e vamos rodar o comando abaixo:
json-server --watch db.json
Agora dentro de home vamos criar uma pasta chamada ‘services’
No terminal vamos entrar na pasta services e digitar o seguinte comando “ng g s home”
E assim será criado nosso serviço. Dentro do nosso home.service.ts vamos criar uma função que se comunique com a nossa url.
Agora no nosso app.module.ts / Vamos adicionar nos imports o httpClientModule
No nosso home.component.ts / vamos chamar o serviço pelo constructor e vamos criar uma função chamada getList().
Agora daremos um console log no “resposta” e esse será nosso retorno no inspecionar da web
Em seguida como já sabemos que está tudo ok, vamos adicionar nosso ngIf no html e chamar o nome e o sobrenome para nossa tabela.
E nossa tela vai ficar dessa forma:
No próximo artigo vamos criar um botão para adicionar, mais pessoas na nossa lista.