AngularJS 当我在浏览器地址栏中输入基地 url 时，路由器没有启动

Question

我在 http://localhost:8080/ 使用 Node.js 服务 Angular 应用程序。但是，当我在浏览器地址栏中输入此 URL 时，主页模板不会显示在应用程序内容区域中 - 仅显示顶部导航（它是外壳的一部分）。这是我的路由器配置：

angular
    .module('app')
    .config(configRouter);

configRouter.$inject = ['$routeProvider'];

function configRouter($routeProvider) {
    $routeProvider
        .when('/', {
            templateUrl: 'home/home.html',
            controller: 'Home',
            controllerAs: 'vm'
        })
        .when('/profile', {
            templateUrl: 'profile/profile.html',
            controller: 'Profile',
            controllerAs: 'vm'
        })
        .otherwise({ redirectTo: '/' });
}

有趣的是，当我单击顶部导航中的链接时，会加载正确的模板（包括主页模板）。这是我的顶级导航代码：

<div id="navbar" class="navbar-collapse collapse">
    <ul class="nav navbar-nav">
        <li class="active"><a href="#/">Home</a></li>
        <li><a href="#/profile">Profile</a></li>
    </ul>
</div>

我在浏览器地址栏中尝试了各种 URL 组合，但没有任何效果：

http://localhost:8080/
http://localhost:8080/#
http://localhost:8080/#/

可能是什么问题？从应用程序内部调用时，相同的 URL 是如何工作的？

提前感谢您的宝贵时间。

编辑

顺便说一句，我几乎完全遵循 John Papa 的 AngularJS 风格指南示例。这可能与我嵌入 shell.html:

的 ng-view 有关

<div data-ng-controller="ShellController as vm">
    <div data-ng-include="'layout/topnav.html'"></div>

    <section id="content" class="content">
        <div data-ng-view class="shuffle-animation"></div>
    </section>
</div>

但他就是这样 - 见 here。

Answer 1

我遇到了类似的问题。

我在 main.html 中使用了 ng-view 并在 index.html 中加载了它（这是第一个加载的文件）然后路由（控制器）没有从 url 激活，但是当我点击我的应用程序中的链接时它起作用了。

然后我将 ng-view 从 main.html 移到 index.html 然后它也从 url 开始工作。

希望对您有所帮助。

Answer 2

您可能必须为页面上的所有相关脚本指定一个基础 URL：

<head>
    <base href="http://www.companyXYZ.com/scripts/" target="_blank">

可以找到有关基本标签的更多信息 here。

Answer 3

这是 angular-路由器的一个已知问题：https://github.com/angular/angular.js/issues/1213. The discussion suggests a workaround which is not pretty. As far as I can tell, angular-ui-router has the same issue - see some details here: https://github.com/johnpapa/generator-hottowel/issues/22。目前，最好的解决方案是避免使用 ng-include 嵌套 ng-view。

AngularJS 当我在浏览器地址栏中输入基地 url 时，路由器没有启动

AngularJS router is not kicking in when I enter the base url in browser address bar

angularjs

angular-routing