是否可以将 AngularJS 与 Jinja2 模板引擎一起使用？

Posted 2023-02-23

【中文标题】是否可以将 AngularJS 与 Jinja2 模板引擎一起使用？

【英文标题】：Is it possible to use AngularJS with the Jinja2 template engine?

【发布时间】：2015-08-02 11:37:33

【问题描述】：

我有一个 Flask 站点，我想使用 AngularJS javascript 框架。不幸的是，分隔符似乎重叠。

如果都依赖双花括号 ( expr )，我如何将 Angular 与 Jinja2 一起使用？有没有可能？

【参考方案1】：

你有一些选择。

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 对象上覆盖或子类Flask.jinja_options.update（相关变量：block_start_string、block_end_string、variable_start_string、variable_end_string、comment_start_string、comment_end_string）：

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

由于从服务器端未扩展敏感数据的风险较高，我建议改为在您不是唯一开发人员的任何项目中更改前端（即 Angular）的语法。

3) 输出一个 raw block 在 Jinja2 中使用 % raw % 或 % verbatim %:

<ul>
% raw %
  % for item in seq %
      <li> some_var </li>
  % endfor %
% endraw %
</ul>

4) 使用Jinja2在模板中编写花括号：

 ' some_var ' 

这将在 html 中输出为 some_var 。

我对方法 1 的偏好很明显，但上述任何方法都可以。

【参考方案2】：

还有另一种选择：flask-triangle 是一个扩展，可帮助您构建表单，同时在 jinja2 中集成角度模板。 无需更改角（或 jinja2）括号分隔符，您只需添加一个标识符来告诉 jinja2 表达式是否必须呈现为角表达式。只需在变量后添加|angular：

<div>variable|angular</div>

将在 HTML 输出中呈现为：

<div>variable</div>

请注意 flask-triangle 还带有其他功能（用于构建 angular 样式的表单），但是我认为它可能是一个有价值的选择，可以使 jinja2 中的 angular 模板更具可读性。