ui-router 的延迟加载状态

Question

我的延迟加载库是这样的：ocLazyLoad 我正尝试将它与 ui-router 一起使用。

我在两个单独的文件中声明了我的路线，这两个文件在 build 过程中连接在一起。这是串联输出的内容：

angular.module('asdf').config(['$stateProvider', '$locationProvider', '$urlRouterProvider', function($stateProvider, $locationProvider, $urlRouterProvider) {

    $urlRouterProvider.otherwise('/');
    $locationProvider.hashPrefix('!');

    $stateProvider
        .state('root', {
            url: '/',
            templateUrl: 'views/static/welcome.html'
        });
}]);

angular.module('asdf').config(['$stateProvider', function($stateProvider) {
    $stateProvider
        .state('cohort-definition-editor', {
            url: '/cohort-definition-editor',
            templateUrl: 'components/cohort-definition-editor/mui/cohort-definition-editor.html',
            controller: 'CDEController',
            data: {
                pageTitle: "Cohort Definition Editor",
                subTitle: "Cohort Definition Editor",
                category: "Apps"
            },
            params: {
                _form_LinkId: undefined
            },
            resolve: {
                dep: ['$ocLazyLoad', function($ocLazyLoad) {
                    // console.log('test');
                    return $ocLazyLoad.load([
                        'components/cohort-definition-editor/mui/cohort-definition-editor.min.js',
                        'components/cohort-definition-editor/mui/cohort-definition-editor.min.css'
                    ]);
                }]
            }
        });
}]);

（第二个文件很多是自动生成的，所以重复是有意的。）

我的问题是：处于延迟加载状态时无法刷新页面。我将从这里开始我的页面加载：http://127.0.0.1:9001/#!/ and then click a link with a ui-sref="cohort-definition-editor" that loads this url: http://127.0.0.1:9001/#!/cohort-definition-editor（使用正确的 state/html fragment/etc）。如果我刷新页面，则会看到 "empty" 状态。通常，默认情况下会显示 views/static/welcome.html，但在应该显示 cohort-definition-editor HTML 片段的地方我什么也得不到，而 URL 仍然是正确的。

我在 ui-router 事件中添加了一堆观察者，其中 none 在页面加载时触发。我也试过添加一个 console.log 语句（见上文，在解决部分评论）并且也没有触发，让我相信页面加载时的 DI 有问题。不过它并没有出错，所以很难追踪。

是否有更好的方法来延迟加载 ui-路由器状态，或者我只是做错了？作为参考，我首先从 here 了解到 ocLazyLoad，它做了类似的事情并且确实有效。

Answer 1

幸运的是，如果您刷新页面但您的状态有一个未设置为默认值的必需参数（即，我将一个参数设置为 undefined），那么路由根本无法加载，因为它需要参数。因此，这里最好的做法是使参数具有默认值。

ui-router 的延迟加载状态

lazy-loaded states with ui-router

javascript

lazy-loading

angularjs

angular-ui-router