# Cannot read property of undefined http get request

**URL:** <https://forum.ionicframework.com/t/cannot-read-property-of-undefined-http-get-request/68534>\
**Category:** ionic-v3\
**Created:** [October 28, 2016, 6:47pm UTC](https://forum.ionicframework.com/t/cannot-read-property-of-undefined-http-get-request/68534 "2016-10-28T18:47:31Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![pirocoptero](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/pirocoptero/32/103953_2.png) [@pirocoptero](https://forum.ionicframework.com/u/pirocoptero)\
**Post date:** [October 28, 2016, 6:47pm UTC](https://forum.ionicframework.com/t/cannot-read-property-of-undefined-http-get-request/68534/1 "2016-10-28T18:47:31Z")

</div>

hey buddies, im getting error while trying to show data in view. Helpe me please…

“Cannot read property ‘logradouro’ of undefined”

PS: console.log of data from http request  
`Object {cep: "84020-150", logradouro: "Rua Catão Monclaro", complemento: "", bairro: "Centro", localidade: "Ponta Grossa"…}`

**CADASTRO.TS**

```
import { Component } from '@angular/core';
import { NavController, LoadingController, AlertController } from 'ionic-angular';
import {Http} from '@angular/http';

import { FormBuilder, Validators } from '@angular/forms';

@Component({
  selector: 'page-cadastro',
  templateUrl: 'cadastro.html'
})
export class CadastroPage {

  public enderecoData: any;

 constructor(
    public nav: NavController,
    private http:Http,
    public formBuilder: FormBuilder,
    public alertCtrl: AlertController ) { 
 }
 
 elementChanged(input){
    let field = input.inputControl.name;
    this[field + "Changed"] = true;

    if (field == 'cep') {
      this.http.get('https://viacep.com.br/ws/'+input.inputControl.value+'/json/')
		    .map(res => res.json())
		    .subscribe(data => {
          this.enderecoData = data;

		    });
    }

  }

}

```

**CADASTRO.HTML**

```
<ion-item>
        <ion-label stacked>Rua</ion-label>
        <ion-input clearInput #rua formControlName="rua" type="text" (change)="elementChanged(rua)"
        [class.invalid]="!cadastroForm.controls.rua.valid && (ruaChanged || submitAttempt)">{{enderecoData.logradouro}}</ion-input>
</ion-item>
```

---

<div class="post-metadata">

**Author:** ![rapropos](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/rapropos/32/100227_2.png) [@rapropos](https://forum.ionicframework.com/u/rapropos)\
**Post date:** [October 28, 2016, 8:01pm UTC](https://forum.ionicframework.com/t/cannot-read-property-of-undefined-http-get-request/68534/2 "2016-10-28T20:01:03Z")

</div>

I would seed `enderecoData` in the component constructor to some dummy value so that by the time the template wants to access it, it’s not undefined.

---

<div class="post-metadata">

**Author:** ![pirocoptero](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/pirocoptero/32/103953_2.png) [@pirocoptero](https://forum.ionicframework.com/u/pirocoptero)\
**Post date:** [October 28, 2016, 10:27pm UTC](https://forum.ionicframework.com/t/cannot-read-property-of-undefined-http-get-request/68534/3 "2016-10-28T22:27:06Z")

</div>

please. can you give me an example buddy?

---

<div class="post-metadata">

**Author:** ![pirocoptero](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/pirocoptero/32/103953_2.png) [@pirocoptero](https://forum.ionicframework.com/u/pirocoptero)\
**Post date:** [October 28, 2016, 10:40pm UTC](https://forum.ionicframework.com/t/cannot-read-property-of-undefined-http-get-request/68534/4 "2016-10-28T22:40:05Z")

</div>

i tried to force a value in constructor, but nothing happened in view 😭😭😭

**in constructor …**

```
this.enderecoData = {
  "rua" : "Catão Monclaro"
}

```

**html**

```
<ion-item>
    <ion-label stacked>Rua</ion-label>
    <ion-input clearInput #rua formControlName="rua" type="text" (change)="elementChanged(rua)"
    [class.invalid]="!cadastroForm.controls.rua.valid && (ruaChanged || submitAttempt)">{{enderecoData.rua}}</ion-input>
</ion-item>
```

---

<div class="post-metadata">

**Author:** ![ryanlogsdon](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/ryanlogsdon/32/103208_2.png) [@ryanlogsdon](https://forum.ionicframework.com/u/ryanlogsdon)\
**Post date:** [October 28, 2016, 11:40pm UTC](https://forum.ionicframework.com/t/cannot-read-property-of-undefined-http-get-request/68534/5 "2016-10-28T23:40:54Z")

</div>

You need to add more imports. Map is not declared. 🙂

> [@A very short tutorial on HTTP GET for Ionic2](https://forum.ionicframework.com/t/a-very-short-tutorial-on-http-get-for-ionic2/66723):
>
> Hi All, I wanted to post a very short explainer for the http.get() call since nearly every article I’ve read has 2 vital parts missing: proper error handling & timeout enforcement. First, in your \*.ts file, include the following libraries and operators: import { Http } from '@angular/http'; import 'rxjs/add/operator/map'; import 'rxjs/add/operator/timeout'; Next, the constructor needs to pass in an HTTP object: constructor(public \_http: Http) { // we don't need to do anything here to \_h…

---

<div class="post-metadata">

**Author:** ![pirocoptero](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/pirocoptero/32/103953_2.png) [@pirocoptero](https://forum.ionicframework.com/u/pirocoptero)\
**Post date:** [October 28, 2016, 11:49pm UTC](https://forum.ionicframework.com/t/cannot-read-property-of-undefined-http-get-request/68534/6 "2016-10-28T23:49:48Z")

</div>

Thank you Ryan about your tutorial. My response is ok, my problem is how to show that in HTML 😭

---

<div class="post-metadata">

**Author:** ![pirocoptero](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/pirocoptero/32/103953_2.png) [@pirocoptero](https://forum.ionicframework.com/u/pirocoptero)\
**Post date:** [October 29, 2016, 12:05am UTC](https://forum.ionicframework.com/t/cannot-read-property-of-undefined-http-get-request/68534/7 "2016-10-29T00:05:18Z")

</div>

I just need to know how to seed the  
`<ion-input></ion-input>`  
with the values that is coming from the http request. I have the values on response, the request is ok, i just need to seed the ion-input with that value 😭 😭 😭

---

<div class="post-metadata">

**Author:** ![pirocoptero](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/pirocoptero/32/103953_2.png) [@pirocoptero](https://forum.ionicframework.com/u/pirocoptero)\
**Post date:** [October 29, 2016, 12:19am UTC](https://forum.ionicframework.com/t/cannot-read-property-of-undefined-http-get-request/68534/8 "2016-10-29T00:19:40Z")

</div>

Buddies i’m so sorry about my basics HTML’s mistakes! i was putting the {{enderecoData.logradouro}} between the  
{{enderecoData.logradouro}} and the correct is in

**INCORRECT**  
`<ion-input>{{enderecoData.logradouro}}</ion-input>`

**CORRECT**  
`<ion-input value="{{enderecoData.logradouro}}"></ion-input>`

Thank you for your help.

---

<div class="post-metadata">

**Author:** ![ryanlogsdon](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/ryanlogsdon/32/103208_2.png) [@ryanlogsdon](https://forum.ionicframework.com/u/ryanlogsdon)\
**Post date:** [October 29, 2016, 12:23am UTC](https://forum.ionicframework.com/t/cannot-read-property-of-undefined-http-get-request/68534/9 "2016-10-29T00:23:22Z")

</div>

I’m a little concerned because syntactically, they should both work.

This should work as well…

```
<ion-input [value]="enderecoData.logradouro"></ion-input>

```

_caution! writing this code off the top of my head!_ 🙂