Acessar dados de um JSON

Olá, o parse já é feito automaticamente do rest para o resultado.

Penso que você pode acessar a propriedade bairro da seguinte forma: this.resultado.bairro

Foi minha primeira tentativa, mas logo dá um erro de compilação dizendo que a propriedade bairro não existe.

Pode mostrar os dados rest retornados?

$scope.buscarCep = function(){
        if($scope.cep.length >= 8){
            $http.get("https://viacep.com.br/ws/"+$scope.cep+"/json/").then(function(response){
                $scope.endereco = response.data ;
                console.log(response.data);
            }).catch(function(){
                console.log("DEU ERRO");
            });

São os dados retornado por esse link público: http://viacep.com.br/ws/81350000/json mas de qualquer forma, ele retorna isso:

{
  "cep": "81350-000",
  "logradouro": "Rua João Bettega",
  "complemento": "de 2966/2967 a 6097/6098",
  "bairro": "Cidade Industrial",
  "localidade": "Curitiba",
  "uf": "PR",
  "unidade": "",
  "ibge": "4106902",
  "gia": ""
}

Oi Thiago, acredito que você me mandou uma solução em AngularJS (1) e não consegui reimplementa-la no Angular 2, pois o then por exemplo diz ser incompatível com o tipo Observable <Response. Olhando seu exemplo parece que você imprime no console os dados e minha dúvida é justamente trabalhar com esses dados, pois o meu também já imprime o resultado inteiro.

Patrick, você verificou se os dados foram realmente retornados na consulta. Dá um console.log no resultado para verificar se os dados são retornados.

Foram sim, repare que faço um console.log para teste. Ele me retorna um Object com os dados do JSON dentro, só queria saber a maneira de pegar...

Olá Patrick, vc tem razão, pois estou utilizando o Angular 1.6, porém acredito que a forma com que os dados são retornados, pode-se utilizar algo parecido no angular 2, ainda não parei para estudar.

Vou mostrar como faço pra pegar o bairro, cep, etc. na versão 1, talvez ajude.

$scope.buscarCep = function(){
        if($scope.cep.length >= 8){
            $http.get("https://viacep.com.br/ws/"+$scope.cep+"/json/").then(function(response){
                $scope.endereco = response.data ;
                console.log(response.data);
            }).catch(function(){
                console.log("DEU ERRO");
            });

// Na minha view eu faço isso:
{{endereco.cep}}
{{endereco.logradouro}}
{{endereco.uf}}

ng-model="endereco.bairro" --> Como os dados de retorno está em formato JSON, pode-se manipulá-lo como tal.

Att,

Tenta substituir res.json() por: - res.data;

Tive que utilizar a função map do RxJS para tratar o res como um array, assim:

      http
        .get('http://viacep.com.br/ws/81350000/json')
        .map( res => res.json())
        .subscribe(resultados => {
            this.resultado = resultados;
            console.log(this.resultado);
      });

E usando o exemplo do Thiago, mostrei na view assim:

{{ resultado.cep}}

Só para complementar, sou aluno e nenhum especialista... Fiz um teste assim e deu certo..

bairro: string;
    constructor(http: Http){

        http
        .get('http://viacep.com.br/ws/81350000/json')
        .subscribe(res => {
           this.bairro = res.json().bairro;
           console.log(this.bairro);
           // Cidade Industrial
        });


    }

Posso então declarar todas as minhas propriedades, mas o que eu faria era ter um objeto do tipo JSON e fazer assim

this.objJson = res.json();
// acessar propriedades assim
this.objJson.bairro
this.objJson.cep