Jinja：在 HTML 属性中连接“#”+ 变量？答案

【问题标题】：Jinja: Concatenate '#' + variable in HTML attribute?Jinja：在 HTML 属性中连接“#”+ 变量？
【发布时间】：2017-10-29 09:48:52
【问题描述】：

在一个 Django 项目中，我使用的是 Jinja + pug。为了帮助处理我正在谈论的元素，我在下面的代码中在它们上方添加了四个正斜杠：

each val in bottles
            tr
                th(scope="row")= index
                ...
                    div.text-center
                        ////
                        button.btn.btn-default.btn-xs(type="button", data-toggle="modal", data-target='#{{ val.name }}')
                            span.glyphicon.glyphicon-plus.text-primary
                        button.btn.btn-default.btn-xs(type="button", data-toggle="modal", data-target=".remove-bottles")
                            span.glyphicon.glyphicon-minus.text-primary
                //- Add Quantity Modal
                ////
                div.modal.fade(tabindex="-1" role="dialog")(id="{{val.name}}")
                ...

所以基本上第一个button会触发模态div，但是我需要设置data-target='#{{val.name}}'。这样做会导致语法错误，同时添加一个空格（如 data-target='# {{val.name}}'），在井号 (#) 和 {{val.name}} 之间添加一个空格，这意味着 ID 不匹配。

如何将# 和{{val.name}} 与它们之间的空格连接起来？

【问题讨论】：

你能显示错误回溯吗？
我并没有真正得到回溯，除了一条消息 invalid syntax (<string>, line1) 我怀疑这是因为该表单是从另一个文件中包含的。
我认为问题出在其他地方，而不是 Flask 或 Jinja2。 js中的数据目标值在哪里获取？请看那里。和 console.log 一起使用。检查它是否打印在控制台中。

标签： html django pug jinja2

【解决方案1】：

找到解决办法：

data-target="#" + val['name'])

【讨论】：