如何将模板变量传递给javascript答案

【问题标题】：how to pass template variables to javascript如何将模板变量传递给javascript
【发布时间】：2016-09-26 20:21:02
【问题描述】：

朋友们，我正在尝试将模板变量传递给 javascript 以创建图表。但我不明白。 Django 将所有 js 文件视为静态文件。所以动态模板变量不适用于 javascripts。

我什至试过这个：

passing template variables to javascript

但这也无济于事。只能传递一个变量。其余的都没有。

def profile(request,username):
    try:
        u = User.objects.get(username=username)
        questions = Question.objects.filter(user=u)
        answers = Answer.objects.filter(user=u)
        docs = Document.objects.filter(user=u)
    except User.DoesNotExist:
        pass
    return render(request,"auths/profile.html",locals())

另外，如上面链接中所述，我的 profile.html 是

<input type="hidden" value="{{ u.username }}" id="username" />
<input type="hidden" value="{{ docs.count }}" id="docs" />
<input type="hidden" value="{{ questions.count }}" id="questions" />
<input type="hidden" value="{{ answers.count }}" id="answers" />


{% block extra %}
    <script type="text/javascript">
        var user = document.getElementById("username").value;
        var docs = document.getElementById("docs").value;
        var questions = document.getElementById("questions").value;
        var answers = document.getElementById("answers").value;
    </script>

   <script type="text/javascript" src="{% static 'highcharts.js'%}">      </script>
   <script type="text/javascript" src="{% static 'highcharts-3d.js'%}"></script>

   <script type="text/javascript" src="{% static 'chart.js' %}"></script>


{% endblock %}

我在 chart.js 中传递数据的部分是：

series: [{
  type: 'column',
  name: 'User Profile',
  data: [
      ['Questions',   questions],
      ['Answers',   answers],
      ['Documents',  docs]
  ]
}]

如前所述，问题是只有一个变量被传递，而其他变量没有。结果，没有呈现图表。朋友们该怎么办？

如果有帮助，我正在使用 Django 1.9 和 highcharts。

【问题讨论】：

因为您使用get 进行用户查询，但filter 用于其余部分。 filter 返回一个查询集，而不是模型实例。
我不明白。事情是我想显示特定用户的文档、答案和问题的数量。我不应该使用 get 来查找用户并过滤以提取该特定用户的问题、答案等吗？

标签： javascript django highcharts

【解决方案1】：

为了回答我自己的问题，我想我知道出了什么问题。图表值采用数字格式。但我将它作为字符串传递。因此，需要做的就是使用 javascript 类型转换将这些字符串转换为值或数字。

我在 chart.js 中传递数据的部分是：

series: [{
  type: 'column',
  name: 'User Profile',
  data: [
      ['Questions',   Number(questions)],
      ['Answers',   Number(answers)],
      ['Documents',  Number(docs)]
      ]
}]

把字符串改成数字，图表就渲染好了！

【讨论】：