0

Tengo que hacer una vista como la que se muestra en la imagen.

introducir la descripción de la imagen aquí

La idea es que eso cargue de forma dinámica, recibo una respuesta de una API donde me viene el nombre de la categoría (verduras, cereales, etc) y la porción de cada categoría, entonces como se ve en el prototipo, por ejemplo, la categoría Cereales tiene dos porciones por eso carga dos select, la categoria AOA tiene tres porciones y por eso tres select.

La respuesta de la API me llega de la siguiente manera

introducir la descripción de la imagen aquí

Entonces la duda es, ¿cómo hacer que se creen la cantidad de select dependiendo de la porción de la categoría?, he usado el ngFor pero no veo como puedo usarlo para este caso, muchas gracias.

1 respuesta 1

0

te comento que esto lo podrías hacer dentro del select, pero primero tenés que crear esas agrupaciones de "portion", yo crearía un array.

 array.forEach(x =>{
  let portionArray = []
  for(let i=0; i<=x.portion; i++){
    (x.portionArray) ? x.portionArray.push(0) : x.portionArray = []
  }
})

Entonces ya teniendo mi agrupación lo recorrería en la vista

<div *ngFor="elmento of array">
 <select *ngFor="item of elemento.portionArray>
 <select>
</div>

Si necesitás limpiar o vaciar el portionArray por si sé te duplicara en algún momento debes hacerlo en el constructor.

PS: Una opción que pensé pero no sé si sea útil es la de un opción múltiple.

Tu Respuesta

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

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