0

Buen dia tengo esta funcion en un servicio angular, la cual hice para relacionar dos colecciones en firestore: alumnos y pagos, la idea es recorrer la coleccion alumnos y por CADA UNO de ellos buscar sus pagos y asi ir uniendo ambos en un arreglo para despues consumirlo en un componente al que le paso: datosUsuario y asi llenar facilmente una tabla (no se me ha ocurrido otra mejor manera, acepto todas las sugerencias)

async getUsersConMesesPagados(){
  const userRef = this.afs.firestore.collection('users');
  const pagosRef = this.afs.firestore.collection('pagos/2020/pagosResumen');

  let datosUsuario = [];
  let pagosUsuario;

  const users = await userRef.get().then( usuarios => {
    // console.log('data en GetUsers: ', dusuariosata);
    usuarios.forEach( async user => {
      let usuario = user.data();
      let pagos = await pagosRef.doc(user.id).collection('pagos').get();
      pagos.forEach( pagos => {
        // Pagos por usuario console.log('pagos', pagos.data());
        pagosUsuario = pagos.data();
      });

      let datosJuntos = [];
      datosJuntos = {...usuario, ...pagosUsuario};
      datosUsuario.push( datosJuntos ) ;
    });
  });
  // console.log('datos usuarios:', datosUsuario);
  return datosUsuario;
}

En el componente lo llamo asi:

  verPagos(){
    if (this.form.valid){
     this.pagosPorYear$ = this.adminService.getPagosPorYear(this.yearField, this.statusField, this.grupoField);

     this.adminService.getUsersConMesesPagados()
     .then( data => {
       // si quiero ver lod datos SI me muestra todo el array
      console.log('datos que vienen de funcion', data);
      // si quiero ver por ejemplo la longitud me dice que CERO como si no tuviera nada
      console.log('longitud del array: ', data.length);
      this.alumnosPagos = data;
      console.log('No muestra nada: ', this.alumnosPagos);
     });

    }
  }

pero el problema es que si le pido un console.log de los datos si los veo pero como que aun no estan cargados que no puede utilizarlos el data-table, me parece que el problema es ese: Value below was evaluated just now, porque si hago por ejemplo un .lenght de esa variable me dice que es cero :(, no se como hacer esto o que me recomienden hacer para lograr ese objetivo :(

introducir la descripción de la imagen aquí

1 respuesta 1

1

Esto se debe a que las llamadas asíncronas que haces dentro del then no se esperan porque el await no funciona con el forEach. Puedes usar for-of que implementa iteradores y funciona con async/await. Por eso cuando se resuelve el get de users se devuelve el datosUsuario que tiene longitud 0 porque el await no funciona con el forEach.

Prueba así a ver si te va. He puesto commentarios en tu código por que hay cosas que me parecen que son incorrectas.

async function getUsersConMesesPagados(){
  const userRef = this.afs.firestore.collection('users');
  const pagosRef = this.afs.firestore.collection('pagos/2020/pagosResumen');

  let datosUsuario = [];
  let pagosUsuario;

  const users = await userRef.get();

  for (let user of users.docs) {
    let usuario = user.data();
    let pagos = await pagosRef.doc(user.id).collection('pagos').get();
    pagos.forEach( pagos => {
      // Pagos por usuario console.log('pagos', pagos.data());
      // Esto no se entiende porque estas reasignando los pagos en cada itereción?
      pagosUsuario = pagos.data(); 
    });

    let datosJuntos = []; // esto no debería ser un objeto? se puede simplificar asi
    // let datosJuntos = {...usuario, ...pagosUsuario};
    datosJuntos = {...usuario, ...pagosUsuario};
    datosUsuario.push( datosJuntos ) ;
  }
  // console.log('datos usuarios:', datosUsuario);
  return datosUsuario;
}
6
  • intente probar lo que comentas pero en el: for (let user of users) { me aparece el error sobre users: Type 'QuerySnapshot<DocumentData>' must have a '[Symbol.iterator]()' method that returns an iterator.ts(2488) :( apenas comienzo con Angular ¿me puedes sugerir algo para ese error? Commented el 24 jun. 2020 a las 14:58
  • he actualizado mi respuesta. No he usado nunca firestore pero viendo su api creo que debería ser users.docs porque la propiedad docs es la que tiene el array de documentos.
    – hawks
    Commented el 24 jun. 2020 a las 15:18
  • muchas gracias me ayudaste mucho, ahora tengo dudas existenciales para encadenar promesas pero creo que tendré que hacer otra pregunta distinta :) Commented el 25 jun. 2020 a las 17:48
  • pues acepta la respuesta marcando el check a la izquierda. Aqui puedes mirar como encadenar promesas javascript.info/promise-chaining
    – hawks
    Commented el 25 jun. 2020 a las 18:16
  • perdona ya acepte la respuesta, nuevamente mil gracias y que en esta pandemia tu y tu familia se encuentren bien. Commented el 26 jun. 2020 a las 13:38

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.