Uma biblioteca Angular para busca de CEP, endereço e geocódigo pelos diversos serviços disponíveis a seguir: ViaCep, OpenStreetMap, Mapbox, Google Maps. Foi desenvolvida utilizando como base a biblioteca ngx-viacep.
yarn:
yarn
yarn env:config
yarn build
yarn startnpm:
npm i
npm run env:config
npm run build
npm startyarn:
yarn add @apsoftwaresi/ng-localizacao
yarn add @types/apsoftwaresi/ng-localizacao -Dnpm:
npm install @apsoftwaresi/ng-localizacao --saveNo módulo onde for necessário buscar CEP, importar NgLocalizacaoModule e adicionar aos imports, como no exemplo abaixo:
import { BrowserModule } from "@angular/platform-browser";
import { NgModule } from "@angular/core";
import { NgLocalizacaoModule } from "@apsoftwaresi/ng-localizacao"; // Importando o módulo
import { AppComponent } from "./app.component";
@NgModule({
declarations: [AppComponent],
imports: [
BrowserModule,
NgLocalizacaoModule, // Registrando o módulo
],
bootstrap: [AppComponent],
})
export class AppModule {}No componente onde a funcionalidade for necessária, importar o serviço NgLocalizacaoService e injetá-lo:
import { Component } from "@angular/core";
import { OnInit } from "@angular/core/";
import { NgLocalizacaoService } from "@apsoftwaresi/ng-localizacao"; // Importando o serviço
@Component({
selector: "app-root",
templateUrl: "./app.component.html",
styleUrls: ["./app.component.css"],
})
export class AppComponent implements OnInit {
title = "app";
constructor(private viacep: NgLocalizacaoService) {} // Injetando o serviço
ngOnInit() {}
}O serviço NgLocalizacaoService possui um método para a busca de endereço por CEP, que retorna um Observable, seu uso pode
ser visto abaixo:
this.viacep
.buscarPorCep("01001000")
.pipe(
catchError((error: CEPError) => {
// Ocorreu algum erro :/
console.log(error.message);
return EMPTY;
})
)
.subscribe((endereco: Endereco) => {
// Endereço retornado :)
console.log(endereco);
});As interfaces Endereco, CEPError e o enum CEPErrorCode podem ser importadas da mesma maneira que o serviço, como
no exemplo:
import {
NgLocalizacaoService,
Endereco,
CEPError,
CEPErrorCode,
} from "@apsoftwaresi/ng-localizacao";Para buscar um endereço cujo cep não é conhecido, pode-se utilizar o método a seguir:
this.viacep
.buscarPorEndereco("rs", "porto alegre", "domingos")
.pipe(
catchError((error: CEPError) => {
// Ocorreu algum erro :/
console.log(error.message);
return EMPTY;
})
)
.subscribe((enderecos: Endereco[]) => {
// Array de endereços possíveis retornados :D
console.log(enderecos);
});O método buscarPorEndereco faz uma pesquisa e retorna uma lista de endereços no estado e cidade definidos, cujo
logradouro possua no nome o valor passado no terceiro argumento.
O Serviço NgLocalizacaoService utiliza a classe CEPError para o lançamento de todas as exceções relacionadas à busca de
CEP ou Endereço.
A classe CEPError possui o método getCode.
O enum CEPErrorCode que contém os códigos correspondentes a todos os erros lançados pelo serviço NgLocalizacaoService.
Abaixo encontra-se o código do enum:
export enum CEPErrorCode {
CEP_NAO_ENCONTRADO,
CEP_VAZIO,
CEP_INVALIDO,
CEP_MUITO_CURTO,
CEP_MUITO_LONGO,
UF_VAZIA,
UF_MUITO_CURTA,
UF_MUITO_LONGA,
UF_NAO_EXISTE,
MUNICIPIO_VAZIO,
MUNICIPIO_MUITO_CURTO,
LOGRADOURO_VAZIO,
LOGRADOURO_MUITO_CURTO,
ERRO_SERVIDOR,
}É possível fazer a verificação do erro retornado como no exemplo a seguir:
switch (error.getCode()) {
case CEPErrorCode.UF_VAZIA:
console.log("Por favor, informe a UF.");
break;
case CEPErrorCode.UF_NAO_EXISTE:
console.log("A UF informada não foi encontrada.");
break;
// Quaisquer outros erros contidos em CEPErrorCode podem ser tratados assim
}O método ofType pode ser utilizado para tratar tipos específicos, como no exemplo a seguir:
if (error.ofType(CEPErrorCode.UF_VAZIA)) {
console.log("Ops! Parece que vc não informou a UF ¬¬");
}A propriedade message da classe CEPError conterá uma string com o tipo do erro:
try {
throw new CEPError(CEPErrorCode.UF_VAZIA);
} catch (error) {
// Logará a string "UF_VAZIA" no console
console.log(error.message);
}MIT © Caique Pimenta
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent