Estoy haciendo una página de búsqueda en la que ajax envía los parámetros y luego, al recibir el conjunto de consultas, reconstruyo mis tarjetas. Todo es clásico y funciona bien, aquí hay una versión simplificada de la cosa. Muchas líneas eliminadas o modificadas ya que no es realmente el tema de la publicación.

 let getobject = async (value,url) => { var res2 = await fetch(url, { method: 'POST', headers: { 'Content-Type': 'application/json', 'Accept': 'application/json', "X-CSRFToken": getCookie("csrftoken"), }, body: JSON.stringify({ value: value, }) }) let data2 = await res2.json(); videoitems.innerHTML = '' modalbin.innerHTML = '' data2["data"].forEach(async item => { if (item.ext == '.mp4') { const dynamicreation = async () => { let dyncontent3 = await createnewcard(item) let placing = await videoitems.appendChild(dyncontent3); } const nooncares2 = await dynamicreation() } else if (item.ext == ".pdf") { const dynamicreation2 = async () => { let dyncontent4 = await createnewcard(item) let placing2 = await videoitems.appendChild(dyncontent4); } const nooncares4 = dynamicreation2() } }) }

la función crear nueva tarjeta

 var createnewcard = item => { var dyncontent = document.createElement("div"); dyncontent.innerHTML = `<div class="m-2 extralarge-modal video${item.id}"> <div data-reco="${item.id}" class="extralarge-modal bg-white rounded-lg border border-gray-200 shadow-md dark:bg-gray-800 dark:border-gray-700"> <div class="p-5"> <p class="mb-3 font-normal text-gray-700 dark:text-gray-400"> ${item.title} </p> </div> </div> </div>`; return dyncontent }

Lo que me gustaría saber es si sería posible mezclar este js con la función "incluir" de django y, en lugar de usar litterals de plantilla js, usar un componente html de la tarjeta que incluiría al realizar un bucle en los datos revelados. También podría incluirlo dentro de la función createnewcard js, pero hasta ahora todo falló miserablemente. Muchas gracias