angular-viacep
Version:
Angular Module for integration WebService ViaCep created by César Barone <cesar.bmcosta@gmail.com>
112 lines (110 loc) • 3.81 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Angular ViaCEP demo</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.11/angular.min.js"></script>
<!-- <script src="angular-viacep.min.js"></script> -->
<script src="viaCep.module.js"></script>
<script src="directives/viaCepForm.directive.js"></script>
<script src="directives/viaCep.directive.js"></script>
<script src="helpers/viaCep.helper.js"></script>
<script src="services/viaCep.service.js"></script>
<script>
angular.module('demo', ['angular.viacep'])
.controller('ctrl', function ctrl($scope) {
$scope.address = {
zipcode: null,
street: null,
neighborhood: null,
uf: null,
city: null,
unit: null,
ibge: null,
gia: null,
}
});
</script>
</head>
<body ng-app="demo">
<form name="form" ng-controller="ctrl">
<div via-cep-form>
<div>
Endereço: <br>
<label for="zipcode">CEP</label>
<input type="text" name="zipcode" ng-model="address.zipcode" via-cep="cep">
<span ng-show="form.zipcode.$error.cep">Cep inválido</span>
<br>
<br>
<label for="street">Logradouro</label>
<input type="text" name="street" ng-model="address.street" via-cep="logradouro" disabled>
<br>
<br>
<label for="neighborhood">Bairro</label>
<input type="text" name="neighborhood" ng-model="address.neighborhood" via-cep="bairro" disabled>
<br>
<br>
<label for="uf">UF</label>
<input type="text" name="uf" ng-model="address.uf" via-cep="uf" disabled>
<br>
<br>
<label for="city">Cidade</label>
<input type="text" name="city" ng-model="address.city" via-cep="localidade" disabled>
<br>
<br>
<label for="unit">Unidade</label>
<input type="text" name="unit" ng-model="address.unit" via-cep="unidade" disabled>
<br>
<br>
<label for="ibge">IBGE</label>
<input type="text" name="ibge" ng-model="address.ibge" via-cep="ibge" disabled>
<br>
<br>
<label for="gia">GIA</label>
<input type="text" name="gia" ng-model="address.gia" via-cep="gia" disabled>
</div>
</div>
</form>
<form name="form" ng-controller="ctrl">
<div via-cep-form>
Endereço: <br>
<label for="zipcode">CEP</label>
<input type="text" name="zipcode" ng-model="address.zipcode" via-cep="cep">
<span ng-show="form.zipcode.$error.cep">Cep inválido</span>
<br>
<br>
<label for="street">Logradouro</label>
<input type="text" name="street" ng-model="address.street" via-cep="logradouro" disabled>
<br>
<br>
<label for="neighborhood">Bairro</label>
<input type="text" name="neighborhood" ng-model="address.neighborhood" via-cep="bairro" disabled>
<br>
<br>
<label for="uf">UF</label>
<input type="text" name="uf" ng-model="address.uf" via-cep="uf" disabled>
<br>
<br>
<label for="city">Cidade</label>
<input type="text" name="city" ng-model="address.city" via-cep="localidade" disabled>
<br>
<br>
<label for="unit">Unidade</label>
<input type="text" name="unit" ng-model="address.unit" via-cep="unidade" disabled>
<br>
<br>
<label for="ibge">IBGE</label>
<input type="text" name="ibge" ng-model="address.ibge" via-cep="ibge" disabled>
<br>
<br>
<label for="gia">GIA</label>
<input type="text" name="gia" ng-model="address.gia" via-cep="gia" disabled>
</div>
</form>
</body>
</html>
<style>
form .ng-invalid-cep {
border: solid 1px red;
}
</style>