Question

应用程序工作正常而不添加html5Mode（true），但是当我添加该行（并设置基本href）时，我只是返回一个空白页面。正确加载所有资产文件。看得更深一些，我可以看到，当设置html5Mode（true）时，它没有加载模板。

我定义了这样的路线：

angular
        .module('app')
        .config(['$stateProvider', '$locationProvider', function appRouter($stateProvider, $locationProvider) {

            $locationProvider.html5Mode(true);
            $stateProvider

                .state('app', {

                    abstract: true,
                    url: '',
                    templateUrl: 'modules/app/index.html'

                })

                .state('app.view1', {

                    url: '',
                    templateUrl: 'modules/view1/index.html',
                    controller: 'View1Controller'

                })

                .state('app.view2', {

                    url: '',
                    templateUrl: 'modules/view2/index.html',
                    controller: 'View2Controller'

                });

        }]);

基本标签是这样的：

<base href="/app/index.html" />

文件夹结构如下：

app --> all files required to run app
    css --> css assets
    img --> img
    modules --> all functionality is a module
        app --> main app module. Instantiates app, loads modules, and handles routing
            app.controller.js --> app controller logic
            app.module.js --> app module declaration
            app.router.js --> all app routing
            index.html -->
        view1
            view1.controller.js --> view1 controller logic
            view1.module.js --> view1 module declaration
            index.html --> view1 html
        view2
            view2.controller.js --> view2 controller logic
            view2.module.js --> view2 module declaration
            index.html --> view2 html
    index.html --> main entry point

Answer 1

您当前的设置正在寻找www.example.com/app/modules/app/index.html'。尝试更改基本标记，如下所示：

如果您的网站是www.example.com/index.html，那么<base href="/" />

如果您的网站是www.example.com/other/index.html，那么<base href="/other/" />

来源：Angular.js base tag setting troubleshooting

另外，请使用Chrome开发工具，网络标签仔细检查网址是否正确解析，然后尝试加载状态以查看模板的获取请求是否成功/是否正确的网址。

最后，由于我认为您使用的是ui-router，因此我们还对基本标记进行了问题排查/说明：ui-router docs

Ui-router html5mode没有加载模板

1 个答案: