3

Estou entrando com um cep e uma busca é feita e me traz os outros dados... Porém, quero que os dados sejam exibidos, cada um no seu respectivo campo, pois serão inseridos no banco de dados. Como proceder?

html:

<body ng-controller="appController">
<div align="center">
<form>
<table width="100">
    <label>CEP </label><br>
    <input type="text" ng-model="endereco.cep" ng-blur="pegaCep()"><br>
    <label>Estado </label><br>
    <input type="text" ng-model="endereco.uf"><br>
    <label>Cidade </label><br>
    <input type="text" ng-model="endereco.cidade" size="30"><br>
    <label>Bairro </label><br>
    <input type="text" ng-model="endereco.bairro" size="30"><br>
    <label>Rua </label><br>
    <input type="text" ng-model="endereco.logradouro" size="30"><br>
</table>
</form>
</div>
</body>

controller:

app.controller('appController', function ($scope, $http){
$scope.endereco = {}
$scope.pegaCep = function () {
    $http.get("php/pegaCep.php?cep="+$scope.endereco.cep).success(function (endereco){
        console.log(endereco);
        $scope.endereco = endereco;
    });
 }

});

php:

<?php
ini_set('display_errors', true);
error_reporting(E_ALL);

$cep = $_GET['cep'];
//print_r($cep);

include('correios.class.php');
if(isset($_GET['cep'])){
$correios = Correios::cep($_GET['cep']);
$correios = json_encode($correios[0]);
    die($correios);
}elseif(isset($_GET['codigo_rastreio'])){
    die(json_encode(Correios::rastreio($_GET['codigo_rastreio'])));
}else{
    die('informe parametro GET cep ou codigo_rastreio');
}
?>

Retorno

2
  • Pode incluir um exemplo do conteúdo retornado pela URL php/pegaCep.php ?
    – OnoSendai
    20/01/2016 às 20:43
  • [{"cliente":"","logradouro":"Beco A (Estr Cristiano Kraemer)","bairro":"Vila Nova","cep":"91750073","cidade":"Porto Alegre","uf":"RS"}] 20/01/2016 às 20:48

3 Respostas 3

5

Você está utilizando o serviço $http. O objeto retornado inclui vários parâmetros. Faça as seguintes mudanças no seu código:

$scope.endereco = {};

$scope.pegaCep = function () {
    $http.get("php/pegaCep.php?cep="+$scope.endereco.cep).success(function (retorno){
        console.log(retorno);
        $scope.endereco = retorno.data;
    });
 }

Perceba que a propriedade data contém o valor retornado.

Propriedades do objeto retornado pelo serviço $http:

  • data{string|Object} – o conteúdo da resposta, devidamente transformada.
  • status{number} – Código HTTP retornado.
  • headers{function([headerName])} – função para retorno de cabeçalhos.
  • config{Object} – O objeto de configuração da requisição original.
  • statusText{string} – O status HTTP em formato de texto.

Referência: https://docs.angularjs.org/api/ng/service/$http

12
  • Mesmo com essa mudança no código, os dados não aparecem. 20/01/2016 às 21:15
  • @GustavoSevero No log do browser - pode confirmar se o endpoint está retornando algum conteúdo quando chamado pela função, e não diretamente?
    – OnoSendai
    20/01/2016 às 21:39
  • @lbotinelly não seria o caso de usar um $apply();? Ou de atribuir diretamente o valor ao campo? ex.: $scope.endereco.logradouro = retorno.data.logradouro. Lembro que já passei por isso e só assim resolveu 20/01/2016 às 21:46
  • Sim, está retornando, eu já postei o retorno dos dados: [{"cliente":"","logradouro":"Beco A (Estr Cristiano Kraemer)","bairro":"Vila Nova","cep":"91750073","cidade":"Porto Alegre","uf":"RS"}] 20/01/2016 às 21:46
  • @CelsomTrindade, aparece uma mensagem no console dizendo que logradouro não é reconhecido 20/01/2016 às 21:49
1

Como alternativa à resposta do amigo @lbotinelly, quando passei por uma situação semelhante, o que resolveu o meu problema foi aplicar diretamente o valor para cada campo, deste modo:

$scope.pegaCep = function () {
    $http.get("php/pegaCep.php?cep="+$scope.endereco.cep).success(function (retorno){
        $scope.endereco.cep = retorno.data.cep;
        $scope.endereco.logradouro = retorno.data.logradouro;
        //etc..
    });
};

Ou o uso do $apply() (em último caso).

Caso ainda assim não resolva o seu problema, verifique se o console realmente exibe os dados como você os espera.

$scope.pegaCep = function () {
    $http.get("php/pegaCep.php?cep="+$scope.endereco.cep).success(function (retorno){
        console.log(retorno.data);
    });
}

Pois o problema pode não estar no AngularJS.

Obs.:

Utilize a minha resposta em último caso, a dele está do modo correto.

8
  • Aparece no console "Cannot read property 'cep' of undefined"" 20/01/2016 às 22:39
  • O que o console disso aqui: console.log(retorno.data) mostra? 20/01/2016 às 22:47
  • Isso: 0: Object bairro: "Vila Nova" cep: "91750073" cidade: "Porto Alegre" cliente: "" logradouro: "Beco A (Estr Cristiano Kraemer)" uf: "RS" 20/01/2016 às 22:55
  • Consegue print? Acho que sua array que não está sendo gerada corretamente 20/01/2016 às 23:00
  • Segue o print no post 20/01/2016 às 23:02
0

[{"cliente":"","logradouro":"Beco A (Estr Cristiano Kraemer)","bairro":"Vila Nova","cep":"91750073","cidade":"Porto Alegre","uf":"RS"}]

Já que o retorno do php é esse acima, você precisa fazer o seguinte:

app.controller('appController', function ($scope, $http){
$scope.endereco = {}
$scope.pegaCep = function () {
    $http.get("php/pegaCep.php?cep="+$scope.endereco.cep).success(function (endereco){

        $scope.endereco = endereco.data[0];
    });
 }

});

agora vai funcionar

3
  • Aparece no console "ReferenceError: endereco is not defined" 20/01/2016 às 22:41
  • Eu estou me baseando no código que voce mandou na pergunta, é o mesmo que está atualmente? 20/01/2016 às 22:42
  • Desculpe, não tinha feito uma alteração... Sim, está igual Agora a resposta no console é "TypeError: Cannot read property '0' of undefined" 20/01/2016 às 22:45

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .