将JSON对象从Django传递到Javascript无法正常工作

wmvff8tz  于 2022-11-26  发布在  Go
关注(0)|答案(1)|浏览(108)

我需要在Django中传递一个json对象给一个javascript脚本,我使用了下面描述的方法:
Django: passing JSON from view to template
以下是我的看法:

def test_json(request):
    data = {}
    data['key'] = 'value'
    json_data = json.dumps(data)
    return render(request, 'test_json.html', {'json_data':json_data})

和我的模板:

{{ json_data|json_script:"json_data" }}
<script>
  const mydata = JSON.parse(document.getElementById("json_data").textContent);
  const keys = Object.keys(mydata);
  console.log(keys);
</script>

但控制台的输出如下:

[
  "0",
  "1",
  "2",
  "3",
  "4",
  "5",
  "6",
  "7",
  "8",
  "9",
  "10",
  "11",
  "12",
  "13",
  "14",
  "15"
]

这就像它不识别键,但识别json对象的每个字符作为键,这就像不识别JSON结构。
如果我像这样更改模板中的脚本:

{{ json_data|json_script:"json_data" }}

<script>
   // const mydata = JSON.parse(document.getElementById('json_data').textContent);
//const keys = Object.keys(mydata);
//console.log(keys)
let text = '{ "employees" : [' +
'{ "firstName":"John" , "lastName":"Doe" },' +
'{ "firstName":"Anna" , "lastName":"Smith" },' +
'{ "firstName":"Peter" , "lastName":"Jones" } ]}'; 

const obj = JSON.parse(text); 
const keys1 = Object.keys(obj);
console.log(keys1)
</script>

输出量:

[
  "employees"
]

我正确地得到了密钥,这就像在从Django向模板提供JSON的过程中出现了问题。
有什么建议吗?

  • 谢谢-谢谢
k2arahey

k2arahey1#

当使用json_script过滤器时,不需要首先将对象序列化为JSON,过滤器会为您处理这个问题
检视

def test_json(request):
    data = {'key': 'value'}
    return render(request, 'test_json.html', {'data': data})

模板

{{ data|json_script:"json_data" }}

相关问题