我在Angularjs有一个问题,在我的数据从服务器回来之前,我的HTML中有闪烁。
这里是一个视频演示的问题:http://youtu.be/husTG3dMFOM – 注意#|和灰色区域在右边。
我试过ngCloak没有成功(虽然ngCloak确实防止括号显示为承诺),我想知道隐藏内容的最佳方式,直到HTML已经填充Angular。
我得到它使用这个代码在我的控制器:
var caseCtrl = function($scope,$http,$routeParams) { $('#caseWrap').hide(); // hides when triggered using jQuery var id = $routeParams.caseId; $http({method: 'GET',url: '/v1/cases/' + id}). success(function(data,status,headers,config) { $scope.caseData = data; $('#caseWrap').show(); // shows using jQuery after server returns data }). error(function(data,config) { console.log('getCase Error',arguments); }); }
…但我已经听到一次又一次不从控制器操纵DOM。我的问题是如何使用指令实现这个?换句话说,如何隐藏指令附加的元素,直到从服务器加载所有内容为止?
有一个新的内置指令:
在你的CSS中添加:
[ng\:cloak],[ng-cloak],[data-ng-cloak],[x-ng-cloak],.ng-cloak,.x-ng-cloak { display: none !important; }
<div id="template1" ng-cloak>{{scoped_var}}<div>