如何将HTML视图数据或（Python）服务器数据传递给Angular或JavaScript？

Question

我正在使用Python的webapp2框架在GAE上编写一个小型网页应用。

我想实现的是通过JavaScript或AngularJS将服务器的数据展示到HTML页面上。实际上，这个应用是基于服务器数据使用d3.js绘制一些图表。我知道可以用$http.get从服务器获取数据，但这样的话我需要创建另一个页面或处理程序。我在想有没有什么方法可以做到以下几件事。

1. 在服务器的Python处理程序中，获取存储的数据，然后把这些数据传递给jinja2模板，最后渲染出HTML。
2. 通过jinja2模板的值在HTML页面上展示一些数据。

3. （缺失的部分）如何从Python处理程序将数据传递给JavaScript？或者如何从HTML页面将数据传递给JavaScript？我知道有两种方法可以从HTML页面做到这一点。一种是使用嵌入的JavaScript代码。

   var data = {{serverData}};

另一种是使用带有Angular数据绑定的隐藏输入表单。这两种方法都不是特别好。

4. 计算数据并使用d3.js或其他JavaScript库将结果绘制回页面。

对此有什么想法吗？我觉得可能有一些Angular的方法可以更优雅地做到这一点，但我还没有搞明白。

Answer 1

Jinja2有一个建议，就是在构建模板的时候把对象传入上下文。我不太明白你为什么觉得这样不好看，或者说比仅仅用Jinja2来生成HTML更难看。这里是他们的建议（可以查看http://flask.pocoo.org/docs/templating/）：

<script type=text/javascript>
    doSomethingWith({{ user.username|tojson|safe }});
</script>

正如其他人所建议的，如果你愿意，可以使用RESTful服务，但我不太确定这样会让你的代码更整洁，因为我对你的应用了解不多。根据我的经验，在初始页面加载时嵌入一些数据是一个相当常见的做法，这样可以简化你应用的其他部分。如果你在初始页面加载时已经在服务器上有了这些数据，就不需要处理客户端的异步加载，这样也不会拖慢初始请求的速度。

Answer 2

既然你已经打算用Angular来做前端应用，那为什么不把整个架构做成RESTful呢？这样的话，前端的Angular应用就负责展示内容，而服务器只负责提供数据。你可以通过JSON在服务器和前端之间传递数据，这样就不需要在后端处理HTML或模板了。Angular已经有了Service和$http，可以简化双向数据绑定的过程，结合webapp2的RESTful特性，你可以很轻松地实现这一切。