从数据库中列出数据 - 使用 angularjs 和 API 或在服务器端使用 Jade 生成

Question

我正在创建一个 Node.js 网络应用程序，我不确定是否使用 AngularJS（或其他客户端模板引擎，例如 Ember 或 Backbone) 显示数据库中的数据或在服务器端生成页面（使用 Jade），然后将其发送过来。使用一种方法与使用另一种方法相比有明显的好处吗？

Angular 确实增加了一层额外的复杂性，但同时我担心在服务器端生成页面时涉及的性能损害。

Answer 1

如果您只需要显示来自数据库的一些数据，那么您最好使用服务器端代码。否则，用户必须等待两个 HTTP Get 操作完成才能看到任何结果。第一个加载带有 JS 文件的空页面，第二个加载数据。更不用说需要加载到浏览器的所有 .js 文件和您必须编写的额外代码。

但是如果您的数据需要在不刷新整个页面的情况下更新（通过用户交互或来自服务器的更新），那么您应该查看客户端代码和框架。 Angular 允许您在客户端实现 MVC 模式，这有很多好处，但正如您所说，它看起来也增加了一些复杂性。

Answer 2

你必须同时使用 jade 和 angularjs。是的，jade 在服务器端呈现页面，在客户端呈现 angular。使用两者背后的原因是渲染索引视图或说第一个登陆视图，其中我们的 angular ui-view 指令和我们的应用程序 js 或 css 文件应该用 jade 渲染。之后 angular 将处理所有其他路线。

    extends layout

block base 
  base(href="#{base_url}")
block content

  #Main(ng-app="your-angaulr-app")

      div(ui-view)
        p Load App Here

    var bootstrap = !{JSON.stringify(bootstrap)}; 
  script(src="/bower_components/jquery/dist/jquery.min.js")
  script(src="/bower_components/jquery-ui/jquery-ui.min.js")

  script(src="/bower_components/angular/angular.min.js")
  script(src="/bower_components/angular-ui-router/release/angular-ui-router.min.js")
  script(src="/bower_components/angular-resource/angular-resource.min.js")

  script(src="/js/build/application.js")
  script(src="/js/build/admin-templates.js")

这是您应该从 jade 渲染的 index.jade 文件，之后 angular 将完成他的工作。

从数据库中列出数据 - 使用 angularjs 和 API 或在服务器端使用 Jade 生成

Listing data from database - use angularjs with API or generate using Jade on server-side

node.js

angularjs

pug