我想使用AngularJS与Django,但他们都使用{{}}作为他们的模板标签。是否有一种简单的方法来更改其中之一,以使用其他自定义模板标签?
当前回答
如果你正确地分离了页面的各个部分,那么你可以很容易地在“raw”标签范围内使用angularjs标签。
在jinja2
{% raw %}
// here you can write angularjs template tags.
{% endraw %}
在Django模板中(1.5以上)
{% verbatim %}
// here you can write angularjs template tags.
{% endverbatim %}
其他回答
如果执行任何服务器端插值,唯一正确的方法是使用<>
$interpolateProvider.startSymbol('<{').endSymbol('}>');
其他任何向量都是XSS向量。
这是因为任何没有被Django转义的Angular分隔符都可以被用户输入到插入的字符串中;如果有人将他们的用户名设置为“{{evil_code}}”,Angular会很乐意运行它。但是,如果您使用的字符没有被Django转义,则不会发生这种情况。
你可以使用{% templatetag %}标签告诉Django输出{{和}},以及其他保留的模板字符串。
例如,使用{% templatetag openvariable %}将输出{{。
我会坚持使用一个解决方案,既使用django标签{{}},也使用angularjs{{}},并使用一个逐字section或templatetag。
这只是因为你可以通过$interpolateProvider改变angularjs的工作方式(如上所述)。startSymbol interpolateProvider美元。但是如果你开始使用其他angularjs组件,比如ui-bootstrap,你会发现一些模板已经用标准angularjs标签{{}}构建了。
例如,查看https://github.com/angular-ui/bootstrap/blob/master/template/dialog/message.html。
所以今天我在Angular IRC频道得到了很大的帮助。事实证明,你可以很容易地更改Angular的模板标签。以下必要的代码片段应该包含在你的angular include之后(给定的例子会出现在他们的邮件列表中,并且会使用(())作为新的模板标签,代替你自己的):
angular.markup('(())', function(text, textNode, parentElement){
if (parentElement[0].nodeName.toLowerCase() == 'script') return;
text = text.replace(/\(\(/g,'{{').replace(/\)\)/g, '}}');
textNode.text(text);
return angular.markup('{{}}').call(this, text, textNode, parentElement);
});
angular.attrMarkup('(())', function(value, name, element){
value = value.replace(/\(\(/g,'{{').replace(/\)\)/, '}}');
element[0].setAttribute(name, value);
return angular.attrMarkup('{{}}').call(this, value, name, element);
});
此外,我还指出了即将进行的增强,它将公开startSymbol和endSymbol属性,可以将它们设置为您想要的任何标记。
你可以试试逐字逐句的Django模板标签 像这样使用它:
< script src = " https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js " > < /脚本> {% verbatim %} < div ng-app = " " > <p>10是{{5 + 5}}</p> < / div > {% endverbatim %}
推荐文章
- 什么时候JavaScript是同步的?
- 如何在Typescript中解析JSON字符串
- Javascript reduce()在对象
- 在angularJS中& vs @和=的区别是什么
- 错误"Uncaught SyntaxError:意外的标记与JSON.parse"
- JavaScript中的querySelector和querySelectorAll vs getElementsByClassName和getElementById
- 如何/何时使用ng-click调用路由?
- 给一个数字加上st, nd, rd和th(序数)后缀
- 如何以编程方式触发引导模式?
- setTimeout带引号和不带括号的区别
- 在JS的Chrome CPU配置文件中,'self'和'total'之间的差异
- django MultiValueDictKeyError错误,我如何处理它
- 用javascript检查输入字符串中是否包含数字
- 如何使用JavaScript分割逗号分隔字符串?
- 在Javascript中~~(“双波浪号”)做什么?