0

estoy haciendo un formulario para crear una cuenta y me encuentro con el siguiente problema.

Lo primero que hago es ir a buscar el json a una api que por el momento tengo el json de manera local en assets,

Este es el metodo del servicio que se encarga de buscar el json

getJoinCustomer():Observable<JoinCustomer>{
  return this.http
        .get(this._url).pipe(
          map((res:Response)=>res.json())
        )
}

Luego en mi componente inyecto el servicio y lo llamo dentro de un metodo para mapearlo a mi propiedad.

  getJoinCustomer():void{
    this._joinService.getJoinCustomer()
    .subscribe(joinCustomer => {
          this.joinCustomer = joinCustomer;
                     this.join = new Join(this.joinCustomer.customerID)                              
          })

Y llamo este metodo desde el

ngOnInit(){
this.getJoinCustomer();
}

E inclusive si hiciera el modelo de la siguiente forma

    {"joinCustomer":[{
   "customerID":"ASD123"
   }]}

JSON

    export class JoinCustomer{
   customerID:string;
   }

JoinCustomer.ts

Me genera el error

TypeError: Cannot read property 'customerID' of undefined

2 respuestas 2

2

Esto te ocurre porque en la función:

  getJoinCustomer():void{
    this._joinService.getJoinCustomer()
    .subscribe(joinCustomer => this.joinCustomer = joinCustomer)

    console.log(this.joinCustomer.customerID) //this is TypeError
  }

usas la propiedad joinCustomer fuera del subscribe por lo que seguramente en este momento sea undefined, ya que es una llamada asíncrona y puede tardar X tiempo en saltar el subscribe.

Si quieres mostrar por consola que te trae el dato correctamente, sería así:

  getJoinCustomer():void{
    this._joinService.getJoinCustomer()
    .subscribe(joinCustomer => {

         this.joinCustomer = joinCustomer
         console.log(this.joinCustomer.customerID) //this is TypeError
    })


  }
6
  • mmm me sigue apareciendo como undefined, puse el console.log ahi para ver si traia el dato nada mas la idea es llamarlo despues de llamar el metodo en el ngOninit y ahi es donde me tira undefined realmente
    – PCH
    Commented el 9 may. 2018 a las 19:21
  • Edito lo siento en el console lo he puesto antes de asignarlo xD
    – lDanny7
    Commented el 9 may. 2018 a las 20:05
  • Si, el tema es que llamando todo dentro del subscribe funciona, pero tendría que ser asi?
    – PCH
    Commented el 9 may. 2018 a las 20:08
  • Tiene que ser así y eso es porque haces un petición get que es asíncrona , por lo tanto no sabes cuando vas a recibir la respuesta y el subscribe se mantiene a la espera de la respuesta, y cuando llega salta y se ejecuta por eso tiene que estar dentro. Qué problema se te presenta que este dentro?
    – lDanny7
    Commented el 9 may. 2018 a las 20:47
  • ahi edite , yo inicializo el join dentro del subscribe porque dentro forma mi joincustomer es undefined, despues si tengo que hacer un submit por ejemplo con ese join, va a estar disponible?
    – PCH
    Commented el 9 may. 2018 a las 21:16
0

{"joinCustomer":[{ "customerID":"ASD123" }]}

la razon por la cual sale el error es por que no puedes acceder a un elemento que esta dentro un array o lista de esa manera, seria por ejm asi: this.joinCustomer[0].customerID

1
  • si de igual manera cambio el json, sigue sin andar afuera del subscribe, como que no termina de cargar el dato antes de que haga el render del componente
    – PCH
    Commented el 9 may. 2018 a las 20:40

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.