将 Django 字符串列表作为数组传递给 JS答案

【问题标题】：Pass Django list of strings to JS as an array将 Django 字符串列表作为数组传递给 JS
【发布时间】：2018-05-31 16:19:33
【问题描述】：

目标：我想将 Django 中的字符串列表作为字符串数组传递给模板 JS，并获取数组中每个字符串的索引。

问题：Javascript indexOf() 正在计算每个字符（例如字母、单引号和括号）。我下面的尝试基于this、this 和this。

代码 1：我尝试了 escapejs 和 safe 过滤器，但 indexOf() 为数组中的第一项返回 2（应该是 0）。

#views.py
list = [#utf-8 encoded strings]
return render(request, template, {'list': list}) 

#template JS
 $('#id').ready(function() {
 var array = "{{list|escapejs}}";
 console.log(array.indexOf('{{obj}}'));
 #obj is item in list});

代码 2：还尝试了 json.dumps() 与 encode('utf8') 或 json.loads()，但问题仍然存在。

#views.py
list = [#utf-8 encoded strings]
list = json.dumps(list, ensure_ascii=False).encode('utf8')
return render(request, template, {'list': list}) 

#template JS
 $('#id').ready(function() {
 var array = "{{list}}";
 console.log(array.indexOf('{{obj}}'));
 #obj is item in list});

【问题讨论】：

var array = "{{list}}"; 退出模板过程，如下所示：var array = "[\"first\", \"second\"]";。也就是说它是一个字符串，而不是一个数组。
您可以在javascript中使用eval将字符串转换为对象
如果您尝试将 json 对象从前端发送到后端 - 为什么不首先使用使用 django rest 框架构建的 REST API？

标签： javascript python arrays json django

【解决方案1】：

另一种选择是将 Python 字符串列表转换为带有join 的字符串：

list = ','.join(list)
return render(request, template, {'list': list})

然后split 再次在您的模板中使用 JS：

var array = "{{ list }}".split(',');

【讨论】：

【解决方案2】：

正如 Kenda 在评论中提到的那样：

var array = "{{list}}";

将使array 成为一个包含列表表示形式的字符串（Python 列表本身或它的 json 表示形式）。您想要的是将您的列表转储为 json（以确保您有 Python 列表的本机 javascript 表示），因为您已经尝试过并避免在 JS sn-p 中添加引号：

var array = {{list}};

【讨论】：

非常感谢！我实际上在没有双引号的情况下尝试了它，但我的 JSLint 正在返回错误......经验教训：不要盲目地遵循 linter 告诉你的内容 :)