Angular Js 正在从 URL 中删除子目录

Angular Js is removing Sub-Directory from URL

我已将 Angular 应用程序安装在如下位置: http://example.com/my-app

我的App路由是这样的:

var myApp = angular.module('myApp', ['ngRoute','ngAnimate', 'ui.bootstrap', 'angularFileUpload']);

myApp.config(['$routeProvider', function($routeProvider) {  

    $routeProvider
        .when('/templates', {
            controller: 'TemplatesController',          
            templateUrl: '/components/com_myApp/myApp/views/templates/template-list.html'
        })  

        .when('/apps', {
            controller: 'AppController',            
            templateUrl: '/components/com_myApp/myApp/views/apps/app-list.html'
        })

        .otherwise({
            redirectTo: '/templates'    
        }); 

}]);

现在发生的事情是,当我转到 http://example.com/my-app 时,url 而不是显示 http://example.com/my-app#/templates,而是显示为 http://example.com/templates

看来 otherwise 条件基本上是从 url 中删除基本目录 my-app#。我一直在摸不着头脑,阅读后我还尝试将基础 url 添加到 head 标签并尝试将 myApp.config 更改为:

myApp.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {  
    $locationProvider.html5Mode(true);
....
}

但是尽管像上面那样使用 $locationProvider 时路由似乎工作正常,但基础 url 仍然没有显示我想要的方式。 url 在 url 路径中显示为 http://example.com/templates 而没有 my-app。我不想 Angular 从 URL 中删除基本路径,我希望 url 像这样显示 http://example.com/my-app/..xyz...

为什么 Angular 这样做?

发生这种情况是因为您已通过指定 $locationProvider.html5Mode(true) 指示 Angular 不使用 hashbang URL。删除或以其他方式注释掉该代码片段,如果您在根模板文件中指定了 <base href="/">,也请删除或注释掉该代码片段,并且只使用 ngRoute 而没有那些。