jquery - 在 jQuery AJAX 请求到 Flask 之后渲染 Jinja

Question

我有一个 Web 应用程序，当 HTML 中的 select 元素发生变化时，它会从 Flask 获取动态数据。当然，这是通过 jquery ajax 完成的。没问题，我明白了。

问题是，动态数据- 由 Flask 发送-，是来自数据库 Flask-sqlalchemy 的对象列表。

当然，数据是从 Flask 以 JSON 格式发送的。

我想遍历这些对象以使用 Jinja 显示它们的信息。

HTML

<select id="#mySelect">
    <option value="option1" id="1">Option 1 </option>
    <option value="option2" id="1">Option 2 </option> 
    <option value="option3" id="3">Option 3 </option>
</select>

jQuery

$('body').on('change','#mySelect',function(){
   var option_id = $('#mySelect').find(':selected').attr('id');
   $.ajax({
     url: "{{ url_for('_get_content') }}",
     type: "POST",
     dataType: "json",
     data: {'option_id':option_id},
     success: function(data){
       data = data.data;
      /* HERE I WANT TO ITERATE THROUGH THE data LIST OF OBJECTS */
     }

   });
});

flask

@app.route('/_get_content/')
def _get_content():
    option_id = request.form['option_id']
    all_options = models.Content.query.filter_by(id=option_id)
    return jsonify({'data': all_options})

PS:我知道 jinja 首先被渲染，所以没有办法将 jQuery 变量分配给 Jinja。那么，如果我不能在 Jinja 中使用数据列表，我该如何遍历它呢？

Answer 1

好的，我明白了。

简单地说，我创建了一个外部 html 文件并向其中添加了所需的 jinja 模板。

{% for object in object_list %}
   {{object.name}}
{% endfor %}

然后在我的 Flask 文件中，我从字面上返回了 render_template 对 jquery 的响应(其中包含 HTML我想追加 )

objects_from_db = getAllObjects()
return jsonify({'data': render_template('the_temp.html', object_list=objects_from_db)}

然后只需将响应中的 HTML 附加到要更新的所需 div。

编辑:这是我制作的 Youtube 视频的链接，其中解释了该过程: https://youtu.be/ZEv4AjvoQOk