使用ui-router的延迟加载状态

时间:2015-03-31 19:32:11

标签: javascript angularjs angular-ui-router lazy-loading

我的延迟加载库是这样的:ocLazyLoad我试图将其与ui-router一起使用。

我在两个单独的文件中声明了我的路由,这些文件在构建过程中连接在一起。以下是连接输出:

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/#!/然后点击带有ui-sref="cohort-definition-editor"的链接,该链接加载此网址:http://127.0.0.1:9001/#!/cohort-definition-editor(使用正确的状态/ html片段/等)。如果我刷新页面,我会被称为“空”状态。通常情况下,默认情况下会显示views/static/welcome.html,但我无法显示cohort-definition-editor HTML片段,并且网址仍然是正确的。

我在ui-router事件中添加了一堆观察者,并且没有一个在页面加载中触发。我还尝试添加一个console.log语句(见上文,在解析部分中注释)并且也没有触发,导致我认为页面加载上的DI有问题。但这并不是错误的,所以很难追查。

是否有更好的方法来延迟加载ui-router状态,或者我只是做错了?作为参考,我首先从here学到了ocLazyLoad,它做了类似的事情并且肯定有效。

1 个答案:

答案 0 :(得分:0)

幸运的是,如果你刷新页面但是你的状态有一个必需的参数,它没有设置为默认值(即我的参数设置为undefined)那么路线根本无法加载,因为它需要一个参数。因此,最好的办法是让param具有默认值。