2

Solicito ayuda porque no se como proceder. Tengo un proyecto en el que realizo una llamada REST a una API del Ayuntamiento de Madrid. Recibo un .json con los datos de unos eventos próximos, y quiero mostrar parte de esa respuesta en forma de tabla. La cuestión es, que desconozco el número de eventos que voy a recibir por lo que necesito que la tabla sea dinámica en cuestión de filas.

Se me había ocurrido recorrer la respuesta y cada apartado que necesito meterlo en un array:

  ngOnInit(): void {
      this.wS.getEventos().subscribe(data =>{
        for (i = 0; i < data.length; i++){
          this.evento = [data.title]; 
          this.fechaInicio = [data.dtstart];
          this.fechaFin = [data.dtend];
          this.precio = [data.precio];
          this.enlace = [data.enlace];
      }  
    
    },
      error =>{
        console.error(error);
      });
  }

Y luego, para hacer una prueba he intentado mostrar solo el nombre del evento:

<div>
    <table class="table">
        <tr>
            <th scope="col">EVENTO</th>
        </tr>
        <tr>
            <td *ngFor="let event of evento">{{event.evento}}</td>
        </tr>
    </table>
</div>

Pero no me muestra nada, imagino que está mal formulado.

¿Alguien podría ayudarme? , Gracias de antemano.

1 respuesta 1

2

En tu bucle for estás machacando contínuamente los datos, no estás creando un array y rellenándolo. De hecho, puedes ahorrarte el bucle:

//puedes declarar una interface Evento con los atributos esperados
public eventos: Evento[];

ngOnInit(): void {
  this.wS.getEventos().subscribe(data =>{
    this.eventos = data;
  },
  error =>{
    console.error(error);
  });
}

Y recorrer el array obtenido directamente de la respuesta:

<div>
    <table class="table">
        <tr>
            <th scope="col">EVENTO</th>
            <th scope="col">FECHA INICIO</th>
        </tr>
        <tr *ngFor="let evento of eventos">
            <td >{{evento.title}}</td>
            <td >{{evento.dtstart}}</td>
        </tr>
    </table>
</div>
1
  • Muchas gracias! Cierto, luego me di cuenta de que estaba machacando los dato, aunque tu forma sigue siendo más "limpia" que la que después hice. Así que gracias. Commented el 25 nov. 2020 a las 13:34

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.