Estoy tratando de filtrar artículos de blog por ciertas etiquetas a través de ajax. Después de días de aprender ajax y trabajar en esto, se me ocurrió el siguiente código.

Obtuve con éxito los datos filtrados por etiqueta y ahora quiero mostrarlos como HTML.

Utilicé el ciclo .each para recorrer los valores en app.js e intenté insertar el HTML en la trial de identificación del encabezado en all-articles.html .

Recibo un error de sintaxis en la consola. ¿El error de sintaxis está en el JSON? datos. Aquí está la captura de pantalla del error. ¡Cualquier ayuda es apreciada! Gracias

all-articles.html

 {% for article in page_obj %} <article> <header id="trial> <h4>{{ article.title }}</h4> </header> </article> {% endfor %}

app.js

 $(document).ready(function () { $(".tag-nav-links").on("click", function (e) { e.stopPropagation(); return $.ajax({ type: "POST", url: "", data: { filter: `${e.target.textContent}` }, success: function (json) { var html = ""; $(json).each(function (index, value) { html += "<h4>{{" + value.title + "}}</h4>"; }); $("#trial").append(html); }, }); }); });

views.py

 @csrf_exempt def allarticles(request): articles_list = Articles.objects.all() paginator = Paginator(articles_list, 12) page_number = request.GET.get('page') page_obj = paginator.get_page(page_number) all_tags = Tags.objects.all() if request.is_ajax(): tag_assign = request.POST['filter'] tag = Tags.objects.get(tag=tag_assign) data = serializers.serialize('json', Articles.objects.filter(articletags__tag=tag)) return JsonResponse(data, safe=False) context = {'page_obj': page_obj, 'all_tags': all_tags} return render(request, "All-articles.html", context)