大佬教程收集整理的这篇文章主要介绍了angularjs – 在ui路由器解析过程中应用加载微调，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
如果我想显示一个微调器，而这些工作被执行，以增加用户体验怎么办？
实际上，否则用户将感觉到应用程序已经被阻塞，因为没有视图元素被显示一些毫秒> 600。
当然，有一种方法来定义一个全局的div元素从当前视图显示为了显示微调的感谢$ scope。$ rootChangeStart函数。
但我不想隐藏整个页面，只是一个差的旋转在中间。
我想要我的webapp的一些页面不同的方式加载显示。
我遇到了this interesting post包含我上面描述的确切问题：
我应该真的停止使用解决方案加载一些数据，而是开始在相应的控制器直接加载它们？@R_808_9447@更新相应的视图，只要作业被执行，并在我想要的地方，在视图中，而不是全局。
app.directive('showDuringResolve',function($rootScopE) {
return {
link: function(scope,element) {
element.addClass('ng-hide');
var unregister = $rootScope.$on('$routeChangeStart',function() {
element.removeClass('ng-hide');
});
scope.$on('$destroy',unregister);
}
};
});
然后将它放在特定视图的加载器上，例如：
视图1：
<div show-during-resolve class="alert alert-info"> <strong>Loading.</strong> Please hold. </div>
视图2：
<span show-during-resolve class="glyphicon glyphicon-refresh"></span>
此解决方案(以及许多其他解决方案)的问题是，如果您浏览到从外部网站的路由之一，将没有加载以前的ng-view模板，所以您的页面可能在解决过程中为空白。
这可以通过创建一个将作为后备加载器的指令来解决。它将监听$ routeChangeStart并且只有在没有以前的路由时才显示加载器。
app.directive('resolveLoader',function($rootScope,$timeout) {
return {
reStrict: 'E',replace: true,template: '<div class="alert alert-success ng-hide"><strong>Welcome!</strong> Content is loading,please hold.</div>',link: function(scope,element) {
$rootScope.$on('$routeChangeStart',function(event,currentRoute,prev@L_618_28@sRoutE) {
if (prev@L_618_28@sRoutE) return;
$timeout(function() {
element.removeClass('ng-hide');
});
});
$rootScope.$on('$routeChangesuccess',function() {
element.addClass('ng-hide');
});
}
};
});
后备加载器将放置在具有ng-view的元素之外：
<body> <resolve-loader></resolve-loader> <div ng-view class="fadein"></div> </body>
以上是大佬教程为你收集整理的angularjs – 在ui路由器解析过程中应用加载微调全部内容，希望文章能够帮你解决angularjs – 在ui路由器解析过程中应用加载微调所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。