使用 Flask 设置 AngularJS [重复]答案

【问题标题】：Setting up AngularJS with Flask [duplicate]使用 Flask 设置 AngularJS [重复]
【发布时间】：2014-12-13 13:52:47
【问题描述】：

这应该是基本的，但我无法使用 Flask 来获得角度。 Angular 和 Flask 具有相同的变量插值语法 {{ variable }}，根据博客文章，我可以使用管道来区分两者，但下面会导致错误，显示为 no filter named 'angular'

<!DOCTYPE html>
<html ng-app>
  <head>
    <meta charset="utf-8">
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.min.js"></script>
    <script type="text/javascript" src= "http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.js"></script>
  </head>
  <body>
    <label>{{ yourName | angular }}</label>
    <input type="text" ng-model="yourName" placeholder="Enter a name here">
  </body>
</html>

【问题讨论】：

您能否详细说明您遇到的问题？
哪篇博文告诉过你？它是否提供了angular 过滤器以便您自己注册？
@dirn 我的错，这不是一篇博文，而是一个名为 Flask Triangle 的库 - flask-triangle.readthedocs.org/en/latest/installing.html。我没有意识到这是一个需要安装的库，但我现在可以使用它了。

标签： angularjs flask

【解决方案1】：

因为AngularJS和Jinja模板系统都使用“{{}}”符号，所以需要添加flask扩展来处理这个问题。使用三角烧瓶扩展。

将您的实例应用程序注入到 Triangular 构造函数。请检查下面的代码。

app = Flask(__name__)
Triangle(app)

欲了解更多信息，请转至here。

【讨论】：

虽然这段代码 sn-p 可以解决问题，including an explanation 确实有助于提高您的帖子质量。请记住，您是在为将来的读者回答问题，而这些人可能不知道您提出代码建议的原因。

【解决方案2】：

您是否使用render_template 发送该HTML 文档？如果是这样，问题是您使用的是 Jinja2 而不是 Angular。 Jinja2 没有一个叫做 angular 的过滤器。这可以通过添加raw 块来解决

<label>{% raw %}{{ yourname | angular }}{% endraw %}</label>

【讨论】：

【解决方案3】：

一种选择是完全分离 Flask 应用程序和 AngularJS 应用程序。这样，您将不会遇到插值问题，它会消除（或至少减少）应用程序中烧瓶和 angularjs 的耦合。我写了一个简单的教程系列，介绍如何一起使用 Flask 和 AngularJS。我认为它真的会帮助你一起使用 AngularJS 和 Flask - http://tutsbucket.com/tutorials/building-a-blog-using-flask-and-angularjs-part-1/

【讨论】：