angularjs - Angular 路线 - URL 中的额外#

Question

学习一些 Angular - 但我陷入了路由

这是我的 Angular 配置

var meanApp = angular.module('carz', ['ngRoute']);


meanApp.config(function($routeProvider) {
    $routeProvider
        .when('/', {
            templateUrl: 'home.html',
            controller: 'mainCtrl'
        })
        .when('/red', {
            templateUrl: 'red.html',
            controller: 'redCtrl'
        });
});

这是我的链接

<a href="#">Home</a>
<a href="#red">Red</a>

当我加载节点应用程序时，我被定向到

http://localhost:8080/#!/

我的 Angular Controller 在 ng-view 标签内按预期工作

但我无法使用上面的链接从一个 Controller 切换到另一个 Controller 。

如果我选择红色标签，我的网址会添加一个额外的 #

http://localhost:8080/#!/#red

注意我是否手动更改为

http://localhost:8080/#!/red

我的 Controller 发生了变化并且它可以工作，为什么我会得到额外的#

感谢您的帮助

Answer 1

自 AngularJS 1.6 以来，路由发生了重大变化:

The hash-prefix for $location hash-bang URLs has changed from the empty string "" to the bang "!".

(参见https://github.com/angular/angular.js/blob/master/CHANGELOG.md)

解决方案:

要么开始使用#!代替 ＃ 或者设置 $locationProvider 接受仅使用 #，如下所示:

appModule.config(['$locationProvider', function($locationProvider) {
    $locationProvider.hashPrefix('');
}]);