Angularjs和平滑的页面加载
Angularjs和平滑的页面加载
提问于 2013-08-05 17:29:32
我有一个角控制器，从服务器加载4-5个不同的资源。在收到这些资源后，UI将填充页面所需的内容。我现在遇到的问题是页面加载不是很顺利。页面的布局会立即加载，然后在接下来的1-2秒内出现不同的元素。负载时间并不是真正的问题，只是它的突然性。有什么标准的方法来处理这个问题吗？
回答 3
Stack Overflow用户
发布于 2013-08-05 17:41:42
我使用的一个技巧是将所有内容默认为0，然后使用CSS转换在大约250 is (快速淡出)的范围内将它们转换为不透明度1。使用ng类指令加载类时，我会应用它。
给出这段代码：ng-class='{showme:hugeArray}' --当hugeArray完成加载时，它应该应用一个类。在hugeArray加载或存在之前，它将是未定义的，因此为false，类showme将不被应用。当hugeArray从您的资源回来时，它就存在了。
只要把它和这个CSS结合起来：
.something {
opacity: 0;
text-align: center;
-webkit-transition: opacity 0.25s ease-in;
-moz-transition: opacity 0.25s ease-in;
-o-transition: opacity 0.25s ease-in;
-ms-transition: opacity 0.25s ease-in;
transition: opacity 0.25s ease-in;
}
.something .showme{
opacity: 1;
}Stack Overflow用户
发布于 2013-08-05 17:52:45
我可以想出几种不同的方法，这里有几种。这里可能有一个简单的，您可以改变，以满足您的需要。
HTML
<body ng-show="object.length"> ...控制器
$scope.object = Object.query();或者，您可以使用承诺对象来知道它们何时完成加载。我不知道你是否想把身体藏起来，直到它们装好，同时展示它们，或者其他。
Stack Overflow用户
发布于 2013-08-05 19:27:06
我认为这里的其他答案是好的，但ngCloak也值得一提。最好将其与其他一些方法结合使用。
http://docs.angularjs.org/api/ng.directive:ngCloak
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/18064088
复制相关文章
相似问题
腾讯云开发者
