Angular 不适用于 express答案

【问题标题】：Angular not working with expressAngular 不适用于 express
【发布时间】：2018-01-08 01:22:16
【问题描述】：

我有一个非常简单的“应用程序”，但无法弄清楚为什么 Angular 不起作用。单独的角度代码有效，但是当我访问 localhost:3000 时，它不起作用。但是，当我在 html 文件末尾添加角度代码作为脚本时，它确实有效。

server.js

var express = require('express');
var app = express();

app.get('*', function(req, res){
    res.sendFile(__dirname + '/index.html');
})

app.listen(3000, function(){
    console.log('Hello from express');
});

app.js

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

app.controller('MainController', function($scope){
    $scope.message = "message from controller";
})

index.html

<!doctype html>
<html ng-app="myApp">
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.7/angular.min.js"></script>
    <script src="app.js"></script>
  </head>
  <body ng-controller="MainController">
    <div>
      <label>Name:</label>
      <input type="text" ng-model="yourName" placeholder="Enter a name here">
      <hr>
      <h1>Hello {{yourName}}!</h1>
      <h3>{{message}}</h3>
    </div>
  </body>

<script>

</script>

</html>

【问题讨论】：

标签： javascript angularjs node.js express

【解决方案1】：

您需要提供 JavaScript 文件以使其可用。

您可以使用express.static('path/to/file') 提供静态资源。

例如：

app.use('/js', express.static(__dirname + '/js/'));

/js 目录将在您的index.html 文件中作为：

<script src="/js/app.js"></script>

【讨论】：

【解决方案2】：

Angular 项目应该作为静态文件提供。

var express = require("express");
var app = express();

app.use(express.static(__dirname));

app.listen(3000);

【讨论】：