如何结合快速路线和角度路线答案

【问题标题】：How to combine express and angular routes如何结合快速路线和角度路线
【发布时间】：2017-03-28 06:08:21
【问题描述】：

我正在尝试将 Jade AngularJS 与 ExpressJS 结合起来。我有一个 app.js 用于 express 以使用 Grunt 运行服务器。从那个 app.js 我渲染 home.jade ，它把我引导到主页。在主页内，我有 angularJS。我在 AngularJS 目录中创建了另一个 app.js。如何将路线组合在一起？

App.js (Express)

var config = require('./config/config');
var express = require('express');
var bodyParser = require('body-parser');
var cors = require('cors');
var http = require('http');

var app = express();

app.use(cors());
app.use(bodyParser.urlencoded({extended:true}));
app.use(bodyParser.json());

var oneDay = 86400000;
app.use(express.static(config.root + '/public', { maxAge: oneDay }));

app.set('views', config.root + '/app/views');
app.set('view engine', 'jade');

app.get('/', function(req, res){
    res.render('home');
});
app.listen(config.port);

App.js (AngularJS)

var myApp = angular.module("app", []);

myApp.config(function ($routeProvider, $locationProvider) {
    $locationProvider.html5Mode(true).hashPrefix('!');

    $routeProvider
        .when('/haha', {
            title: '',
            templateUrl: '{DIR_TO_JADE_FILE}',
            controller: 'HomeController'
    })    
});

myApp.controller("AppController", function AppController($scope, $http, $location, $window, $rootScope) {
    alert("Initialize...");
    $scope.message = "HELLO";
});

HTML

doctype html
html(lang='en')
 head
  meta(charset='UTF-8')
  meta(name='viewport', content='width=device-width, minimum-scale=1.0, maximum-scale=1.0')
  link(rel='stylesheet', href='css/vendor/simple-line-icons.css')
  link(rel='stylesheet', href='css/vendor/tooltipster.css')
  link(rel='stylesheet', href='css/vendor/owl.carousel.css')
  link(rel='stylesheet', href='css/style.css')
  //- favicon
  link(rel='icon', href='favicon.ico')
  title Random | Home
 body(ng-controller="AppController")
  block content
  include content
  include angularJS

【问题讨论】：

标签： javascript angularjs node.js express

【解决方案1】：

前端和后端路由的拇指规则：

后端路由： 为获取/更新数据而定义的路由。

前端路由： 根据页面定义的路线将向用户显示。

假设我们有两个页面，主页和个人资料页面

所以，前端路由将有两个页面

"/home" 加载主页 "/profile" 加载配置文件

现在在每个页面上，您都需要在 html 页面中显示一些数据，您需要为其创建路由：

"/getHomePageData" 路由返回一些新闻提要（比如说） "/getProfilePageData" 路由返回一些用户相关信息

现在在每个页面上，服务器路由调用成功后，您需要将这些数据以 html 的形式传递给用户。

同意有例外/约定，例如使用玉模板发送编译页面（嵌入数据的页面）。

【讨论】：