Я хотел бы создать приложение AngularJS с URL-адресами в стиле HTML5 (т.е. без фрагмента # в URL-адресе). Таким образом, в модуле контроллера маршрутизации моего приложения Angular у меня есть что-то вроде следующего:
angular.module('app').config(['$routeProvider','$locationProvider',function($routeProvider,$locationProvider) {
$locationProvider.html5Mode(true)
...
}
$routeProvider
.when('/1/:param', /* do something */)
.when('/2/:param', /* do something else */)
.when('/3/:param', /* do something else again*/);
Ряд рабочих примеров, таких как AngularFun, не используют режим HTML5. Для такого запроса, как http://localhost:3005/#/1/foo, ясно, что
- часть
http://localhost:3005/обрабатывается Express на стороне сервера/. Express с радостью обслуживает нашиindex.htmlс поддержкой Angular - маршрут
/1/fooобрабатывается маршрутизатором Angular на стороне клиента.
Скажем, наш server.coffee стандартно выглядит примерно так, как показано ниже (мы обслуживаем статический каталог dist, который содержит наши скомпилированные минимизированные исходники Angular:
express = require 'express'
routes = require './routes'
dir = "#{__dirname}/dist" # sources live here
port = process.env.PORT ? process.argv.splice(2)[0] ? 3005
app = express()
app.configure ->
app.use express.logger 'dev'
app.use express.bodyParser()
app.use express.methodOverride()
app.use express.errorHandler()
app.use express.static dir # serve the dist directory
app.use app.router
routes app, dir # extra custom routes
Если мы используем режим HTML5, наш URL-адрес http://localhost:3005/#/1/foo становится http://localhost:3005/1/foo (больше нет хэша #). На этот раз весь URL-адрес перехватывается Express, и он путается, потому что мы не определяем маршруты, отличные от /.
Что мы действительно хотели бы сказать, так это то, что последняя часть URL-адреса (/1/foo) должна быть «делегирована» Angular для обработки. Как мы можем это сказать?
