0

Quiero mostrar una lista de productos haciendo un llamado a una api que me retorna el json. pero a mi parece la respuesta llega algo tarde, después de que la app arranque y supongo que es por eso que no se me pinta .-

Mi cogigo de peticion:

getPromociones(){

      var url = "x";

      return this.http.get(url).subscribe(
         (data)=>{
            this.data = data['Promociones'];            
            for(var i = 0; i <this.data.length; i++){
                  //console.log('contador'+ i +' '+JSON.stringify(this.data[i]['Titulo']));
                  this.itemsdata[i] = {
                     "id":this.data[i]['IdPromocion'],
                     "title":this.data[i]['Titulo'],
                     "description":this.data[i]['Descripcion'],
                     "image":this.data[i]['Url'],
                     "imageAlt":"avatar",
                     "icon":"icon-heart-outline",
                     "duration":"3:42"
                  }
            }

            this.data2={
               "headerImage":"assets/images/background/14.jpg",
                        "toolBarTitle":"Player",
                        "title":"Promociones",
                        "iconLike":"icon-thumb-up",
                        "iconFavorite":"icon-heart",
                        "iconShare":"icon-share-variant",
                        "iconCar":"icon-cart-arrow-down",
                        "iconCarPlus":"icon-cart-plus",
                        "iconSkipPrevious":"icon-skip-previous",
                        "iconPlay":"icon-play",
                        "iconSkipNext":"icon-skip-next",
                        "items":this.itemsdata
            };

            this.getDataForLayout1(this.data2);
         },error=>{
            console.error("error en la peticione");
         });

    }



    getDataForLayout1 = (data): any => {
         console.log('json '+JSON.stringify(data));
         return data;
}

la primera vez llega asi :

json undefined

ya segundos despues si llega lo muestra en consola pero no en la lista de la app. llega asi:

json {"headerImage":"assets/images/background/14.jpg","toolBarTitle":"Player","title":"Promociones","iconLike":"icon-thumb-up","iconFavorite":"icon-heart","iconShare":"icon-share-variant","iconCar":"icon-cart-arrow-down","iconCarPlus":"icon-cart-plus","iconSkipPrevious":"icon-skip-previous","iconPlay":"icon-play","iconSkipNext":"icon-skip-next","items":[{"id":61,"title":"ASEPXIA CONTROL PUNTOS NEGROS","description":"30% Descuento Precio Sugerido $99,90","image":"https://fefara.blob.core.windows.net:443/tds-demo/promociones/Promociones Julio-24.jpg","imageAlt":"avatar","icon":"icon-heart-outline","duration":"3:42"},{"id":62,"title":"BENGUE SIN OLOR 35 GR GEL","description":"30% Descuento Precio Sugerido $129","image":"https://fefara.blob.core.windows.net:443/tds-demo/promociones/Promociones Julio-30.jpg","imageAlt":"avatar","icon":"icon-heart-outline","duration":"3:42"},{"id":63,"title":"CICATRICURE ARRUGAS 60 GR CRE","description":"30% Descuento Precio Sugerido $268","image":"https://fefara.blob.core.windows.net:443/tds-demo/promociones/Promociones Julio-26.jpg","imageAlt":"avatar","icon":"icon-heart-outline","duration":"3:42"},{"id":64,"title":"DERMAGLOS CREMA 200 GR.","description":"30% Desc. Precio Sugerido $340","image":"https://fefara.blob.core.windows.net:443/tds-demo/promociones/Promociones Julio-36.jpg","imageAlt":"avatar","icon":"icon-heart-outline","duration":"3:42"},{"id":65,"title":"Promo sin grupo!","description":"promo","image":"https://fefara.blob.core.windows.net:443/tds-demo/promociones/Imagen no disponible.jpg","imageAlt":"avatar","icon":"icon-heart-outline","duration":"3:42"}]}

1 respuesta 1

1

Tienes que usar una promise, esto es un bloque de código que al ser llamado (de forma asíncrona) devuelve una confirmación o un error. Puedes leer más acerca de las promesas en javascript (válido tambien para typescript con ionic 3) en el siguiente enlace: https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Promise

volviendo a tu ejemplo deberías hacer algo asi:

getPromociones(){
    return new Promise((resolve, reject) => {
      this.http.get(url).subscribe(res => {
         resolve(res); //devolvemos la respuesta de la llamada http
      }, (err) => {
         reject(err); //devolvemos el error si se diera
      });             
    })
}

y la llamada al método sería algo así:

getPromociones().then(
    res => {
      console.log(res);
    },
    err => {
      console.log(err);
    }
);

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.