Criação de um aplicativo utilizando Dados Abertos do Governo com Angular 7 (Parte 2)

Criando o serviço

A primeira providência que tomaremos será importar o módulo HttpClientModule no módulo principal da aplicação.

No arquivo app/app.module.ts, realize o import e a assinatura no array de imports:

Para iniciar a codificação do serviço, no terminal de comando, digite:

Dois arquivos serão criados: licitacao.service.ts e licitacao.service.spec.ts

O arquivo licitacao.service será responsável pela requisição com a API Rest, e como já informado, vamos consumir um serviço que lista todas licitações, informando uma data como parâmetro.

A figura 1 detalha os dados para a requisição da API.

Image for post
Image for post
Fig.1 — Detalhes para requisição

A resposta da requisição retorna um JSON com uma quantidade grande de atributos e arrays. Achei interessante criar interfaces para mapear esses campos, já que não vamos exibir todas as informações.

No arquivo licitacao.service.ts, entre as linhas 5 e 34, definimos as interfaces com os campos que mostraremos da consulta.

Image for post
Image for post

A primeira interface mapeia o objeto principal. Note que criamos um array de licitações (linha 8).

Na linha 41 definimos o endereço do serviço e no método construtor injetamos a classe HttpClient, responsável pelas requisições http (linha 43).

O método getLicitacoes(linha 46), informamos um campo data (que será tratada posteriormente a formatação).

A implementação do método, invocamos o get de http, tipando o retorno com a interface criada <RetornoLicitacao>, informando a url e o parâmetro.

Na parte 3, vamos criar a interface visual para solicitar e exibir os resultados das requisições das licitações.

Repositório no GIT.

Parte 1

Até a próxima.

Written by

Professor e desenvolvedor

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store