2

我很难理解 Angular.js 路由的行为

这是我的代码

我的 app.js：

'use strict';

var app = angular.module('myApp', []).
  config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
    $routeProvider.when('/game/room', {templateUrl: 'roomGame', controller: roomCtrl});
    $routeProvider.otherwise({redirectTo: '/game/room'});
    $locationProvider.html5Mode(true);
  }]);

index.js 我在其中定义路由服务器端：

app.get('/game', function (req, res)
{
  console.log("we are in /game");
  res.render("game/index", {
      user: req.session
  });
});
app.get('/game/roomGame', function (req, res)
{
  console.log("we are in /game/roomGame");
  res.render("game/roomGame";
});

index.jade:

div(ng-controller="indexCtrl")
    a(href='/') Quitter

    div(ng-view)

还有另一个文件：roomGame.jade，但向您展示源代码并不重要。

现在我打开浏览器并输入：localhost:3000/game。

正如预期的那样，我被重定向到 localhost:3000/game/room 并显示了预期的视图。

但是当我输入： localhost:3000/game/room 或 localhost:3000/game/foo 时，它显示“无法获取 /game/xxx”

我想被重定向到/game，然后到/game/room。怎么可能？

4

1 回答 1

1

当您看到预期的视图时，您是否被重定向到http://localhost:3000/#/game/room？注意#.

当您输入 时http://localhost:3000/game/room，这会命中快速服务器，而不是您的 Angular 应用程序，试图匹配/game/room，因此您看到的消息。

一个想法是在您的服务器上像这样：

app.get('/game/:what', function (req, res) {
    res.redirect('/#/game/' + req.params.what);
});

或更可能：

app.get('/game/*', function (req, res) {
    res.redirect('/#/game');
});

这会将事情从 express 重定向到 Angular 可以处理它们的地方。

于 2013-04-21T20:20:10.307 回答