在点击button发出请求后,由于网络或者数据较大的原因,页面中的angularJS双向绑定数据部分不显示,页面结构很难看,怎么能实现在所有的数据加载完成之前,弹出层覆盖掉原网页并且提示“正在加载”,等所有的数据加载完成之后,再显示带有完整数据的网页。如下面的效果:
业精于勤,荒于嬉;行成于思,毁于随。
https://github.com/cgross/angular-busy/blob/master/README.md 使用这个模块
事先做好遮罩层,发起请求时(一般都是 $http 或 $resource)显示遮罩,promise resolve 后关闭遮罩。
逻辑就是这么简单,但是因为出现的很频繁所以要考虑如何 DRY。
视图层面上,如果遮罩是全应用通用的就不要每个 route 里都写一遍,而是考虑写在比较上层的路由入口,让子路由共享。
调用层面,简单一点把遮罩状态保存在 $rootScope,使用 DI 来随取随用;讲究一点就写个 service 来控制。
遮罩本身可以封装成 directive 便于复用,不过这东西很简单,不封装也罢。
https://github.com/cgross/angular-busy/blob/master/README.md 使用这个模块
事先做好遮罩层,发起请求时(一般都是 $http 或 $resource)显示遮罩,promise resolve 后关闭遮罩。
逻辑就是这么简单,但是因为出现的很频繁所以要考虑如何 DRY。
视图层面上,如果遮罩是全应用通用的就不要每个 route 里都写一遍,而是考虑写在比较上层的路由入口,让子路由共享。
调用层面,简单一点把遮罩状态保存在 $rootScope,使用 DI 来随取随用;讲究一点就写个 service 来控制。
遮罩本身可以封装成 directive 便于复用,不过这东西很简单,不封装也罢。