我有一个Flask网站,我想使用AngularJS JavaScript框架。不幸的是,似乎分隔符重叠。
如果两者都依赖于双花括号({{ expr }}
),如何将Angular与Jinja2一起使用?它甚至可能吗?
答案 0 :(得分:91)
你有一些选择。
1)更改Angular的分隔符表示法:
var app = angular.module('Application', []);
app.config(['$interpolateProvider', function($interpolateProvider) {
$interpolateProvider.startSymbol('{a');
$interpolateProvider.endSymbol('a}');
}]);
为开始和结束符号选择的任何内容都将充当新的分隔符。在这种情况下,您可以使用{a some_variable a}
向Angular表达变量。
这种方法的优点是只需要设置一次并明确。
2)更改Jinja2的分隔符表示法。
在您绑定到应用程序的Flask.jinja_options.update
对象上覆盖或子类Flask
(相关变量:block_start_string
,block_end_string
,variable_start_string
,{{1 }},variable_end_string
,comment_start_string
):
comment_end_string
由于敏感数据从服务器端未扩展的风险较高,我建议在您不是唯一开发人员的任何项目中更改前端(即Angular)的语法。
3)使用jinja_options = app.jinja_options.copy()
jinja_options.update(dict(
block_start_string='<%',
block_end_string='%>',
variable_start_string='%%',
variable_end_string='%%',
comment_start_string='<#',
comment_end_string='#>'
))
app.jinja_options = jinja_options
或{% raw %}
在Jinja2中输出raw block:
{% verbatim %}
4)使用Jinja2在模板中编写花括号:
<ul>
{% raw %}
{% for item in seq %}
<li>{{ some_var }}</li>
{% endfor %}
{% endraw %}
</ul>
这将在HTML中输出为{{ '{{ some_var }}' }}
。
我对方法#1的偏好是显而易见的,但上述任何一种都可行。
答案 1 :(得分:5)
还有另一种选择: flask-triangle 是一个扩展,可帮助您在jinja2中集成角度模板时构建表单。
您可以简单地添加一个标识符来告诉jinja2,而不是更改角度(或jinja2)括号分隔符,如果表达式必须呈现为角度表达式。只需在变量后添加|angular
:
<div>{{variable|angular}}</div>
将在HTML输出中呈现为:
<div>{{variable}}</div>
请注意 flask-triangle 还附带其他功能(用于以角度样式构建表单),但我认为在jinja2中使角度模板更具可读性可能是一个很有价值的选择。