如何将您的视图中的JSON数据传递到Flask中的索引模板？

Question

我试图将视图中的JSON数据发送到Flask中的索引模板，以用作JavaScript的D3库（尝试可视化公司及其收购）。

在views.py中，我查询了我的PostgreSQL数据库（通过SQLAlchemy）来检索所有公司及其各自的收购：

def index(root=None):
    acq = models.Company.query.all()
    #query the database which is defined in models.py
    root = {}
    for u in acq:
       acqui = json.dumps(list(u.aq))
       # u.aq represents each companies' acquisitions
       root [u.name] = acqui 
    return render_template('index.html', root=root)

root是一个字典，其中键是公司名称，值是他们的收购。我试图将其作为变量传递给＆＃39; index.html＆＃39;

在index.html中，在我的JavaScript代码所在的代码中，我试图检索root：

root = '{{root}}';
console.log(typeof(root));
console.log(root);

它的记录＆＃39; root＆＃39;作为字符串类型并以这种格式打印出来：

{u'Google': '["Nest Labs", "Acquisition", "Acquisition", "Waze", "Acquisition", "Acquisition", "Acquisition", "Keyhole Inc.", "Titan Aerospace&#34 ...

我如何通过＆＃39; root＆＃39;字典作为JSON对象，以便在我的index.html中的JavaScript代码中适当地检索它？

Answer 1

您实际上不希望json.dumps数据 - 而是按原样将所有数据传递给模板：

root = {u.name: list(u.aq) for u in acq}
return render_template('index.html', root=root)

然后，在您的JavaScript块中，使用tojson过滤器将数据一次转换为JSON：

var root = {{ root | tojson }};
console.log(typeof root);
console.log(root);