ui路由器的惰性加载状态
lazy-loaded states with ui-router
我的懒惰加载库是这样的: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/#!/然后单击加载此url的ui-sref="cohort-definition-editor"
链接:http://127.0.0.1:9001/#/队列定义编辑器(具有适当的状态/html/fragment/etc)。如果我刷新页面,我会收到一个"空"状态。通常情况下,默认情况下会显示views/static/welcome.html
,但我在应该显示cohort-definition-editor
HTML片段的地方什么都没有得到,而且URL仍然是正确的。
我在ui路由器事件中添加了一些观察者,但没有一个在页面加载时触发。我还尝试添加了一个console.log语句(见上文,在解析部分中进行了评论),但它也不会触发,这让我相信页面加载上的DI有问题。不过它没有出错,所以很难追踪。
有没有更好的方法来延迟加载ui路由器状态,或者我只是做错了?作为参考,我第一次从这里了解到ocLazyLoad
,它做了类似的事情,而且肯定有效。
幸运的是,如果刷新页面,但您的状态有一个未设置为默认值的必需参数(即,我有一个设置为undefined
的参数),则无法加载路由,因为它需要一个参数。因此,这里最好的做法是使param具有默认值。
- ui路由器的惰性加载状态
- 在加载状态之前,我需要在angular js中为每个状态添加角色
- 在angular js中,每次应用程序进入状态时,重新加载状态的最佳方式是什么
- 表现出承诺'加载状态
- mediaelement.js/html5视频在前进过多或后退过多时永远保持加载状态
- Chrome应用程序:无法检索文件加载状态
- 将复选框重置为基于先前复选框的页面加载状态's状态
- UI 路由器不断重定向到索引,并且不加载状态/视图
- 引导手风琴.保留多个面板的页面加载状态
- 如何检测发布商 DFP 广告的 Google 双击的加载状态
- Angularjs ng-repeat中的Angleularjs按钮加载状态指令
- Redux-管理预加载状态
- p:fileDownload的策略,带有对话框和加载状态
- Knockout模板在某些情况下保持加载状态
- 当AJAX调用完成时重置Bootstrap加载状态按钮
- 刷新页面后在jtree中从加载状态返回数据
- 如何摆脱这个{{用户.Id}}(花括号)在页面处于加载状态时使用
- Ui-router加载状态,然后我怎么运行一个函数
- 如何显示加载状态的百分比ajax响应
- 如何监控图像源的完全加载状态