从服务器加载数据时隐藏模板的更好解决方案是什么?
我的解决方案是使用带有布尔变量isLoading的$scope和使用指令ng-hide,例如:< div ng-hide ='isLoading'>< / div>
棱角有另一种方法吗?
解决方法
你这样做的方式非常好(我更喜欢使用state =’loading’并让事情变得更加灵活.)
处理此问题的另一种方法是promises和$routeProvider解析属性.
使用它会延迟控制器执行,直到解决了一组指定的promise,例如.通过资源服务加载的数据准备就绪且正确. Gmail中的标签以类似的方式工作,即.除非已成功从服务器获取数据,否则不会将您重定向到新视图.如果出现错误,您将保持相同的视图或重定向到错误页面,而不是视图,您尝试加载和失败.
你可以像这样配置路由:
angular.module('app',[])
.config([
'$routeProvider',function($routeProvider){
$routeProvider.when('/test',{
templateUrl: 'partials/test.html'
controller: TestCtrl,resolve: TestCtrl.resolve
})
}
])
你的控制器是这样的:
TestCtrl = function ($scope,data) {
$scope.data = data; // returned from resolve
}
TestCtrl.resolve = {
data: function ($q,DataService){
var d = $q.defer();
var onOK = function(res){
d.resolve(res);
};
var onError = function(res){
d.reject()
};
DataService.query(onOK,onError);
return d.promise;
}
}
链接:
> Resolve
>啊啊!刚刚在SO HERE上找到了一个很好的(但令人惊讶的相似)解决问题的方法