首页 > 解决方案 > 如何设置从 python 列表传递到 html 进度条的值

问题描述

我有一个应用程序,人们可以在其中阅读新闻和评论。然后使用 NLP 技术分析这些评论,并将评论分为正面和负面两类。我要做的是在每个新闻项下显示多少百分比的评论是正面的,多少百分比的评论是负面的。所以我所做的是我添加了 [id, header, newsText, date , positiveCommentPercentage,negativeCommentPercentage] 数据每个新闻项都添加到 Python 列表中,并将其附加到另一个列表中,然后将其传递给网页。

 list = [id, headline, newsText, date ,positiveCommentPercentage ,negativeCommentPercentage ]
    newsData.append(list)

template = 'AppOne/news.html'
return render(request, template, {'nd': newsData})

我可以成功地在网页上显示新闻标题、新闻和日期,如下所示,

<div>
{% for x in nd %}
    <h2>{{x.1}}</h2>
    <h5>{{x.2}}</h5>
    <h6>{{x.3}}</h6>
{% endfor %}
</div>

但我想将每个新闻项下的“正面评论百分比”和“负面评论百分比”的数量显示为 2 个进度条,如图所示 进度条上显示的正面评论百分比和负面评论百分比

所以我尝试使用“w3schools”网站中显示的 html 进度条。

    <div class="w3-light-grey w3-round">
<div class="w3-container w3-blue w3-round" style="width:60%">60%</div>

我的问题是如何将从 python 列表传递的 positiveCommentPercentage 、negativeCommentPercentage 值设置为 div 的样式宽度属性。

我在这里使用 Django 框架。所以请帮助我做到这一点,或者使用任何简单的方法提出一种新的方法。

标签: pythonhtmlcssdjango

解决方案


我从来没有遇到过那种插值风格。我要查一下……但如果它适用于标题、文本和日期,我相信它也适用于情绪百分比。对于积极的评论,在您的循环中,例如:

<div class="w3-container w3-blue w3-round" style="width:{{x.4}}%">{{x.4}}%</div>


推荐阅读