Javascript如何增加显示DOM元素的延迟？
[英]Javascript How do I add a delay on displaying the DOM element?
问题描述
I need to add a delay in displaying a page in my app. 
我需要增加在应用程序中显示页面的延迟。 I am using angularjs framework. 我正在使用angularjs框架。 The reason why i need to do this is because, even though my DOM is fully rendered, the data from angularjs is still being read and not added to the DOM. 我需要执行此操作的原因是，即使我的DOM已完全呈现，但仍然读取来自angularjs的数据，而不将其添加到DOM中。 I have tried adding timeout to the ui-view BUT it doesnt do the trick. 我尝试将超时添加到ui视图中，但没有成功。
3 个解决方案
解决方案1
1 2016-09-20 09:08:20
Try to use timeout function : 尝试使用超时功能：
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $timeout) {
$scope.myHeader = "Hello World!";
$timeout(function () {
$scope.myHeader = "How are you today?";
}, 2000);
});
解决方案2
0 2016-09-20 09:18:54
I didn't get why you want to delay page loading 我不明白为什么你要延迟页面加载
What I understood from your problem is that your page is getting displayed in uncompiled form 我从您的问题中了解到，您的页面正在以未编译的形式显示
try to use 尝试使用
ng-cloack directive
The ngCloak directive is used to prevent the Angular html template from being briefly displayed by the browser in its raw (uncompiled) form while your application is loading. ngCloak指令用于防止Angular html模板在您的应用程序加载时由浏览器以其原始（未编译）形式短暂显示。 Use this directive to avoid the undesirable flicker effect caused by the html template display. 使用此伪指令可避免由html模板显示引起的不希望的闪烁效果。
The directive can be applied to the <body> element, but the preferred usage is to apply multiple ngCloak directives to small portions of the page to permit progressive rendering of the browser view. 该指令可以应用于<body>元素，但是首选用法是将多个ngCloak指令应用于页面的一小部分，以允许逐步呈现浏览器视图。
here is complete documentation 这是完整的文档
https://docs.angularjs.org/api/ng/directive/ngCloak https://docs.angularjs.org/api/ng/directive/ngCloak
解决方案3
0 2016-09-29 18:39:49
Use the resolve option to load your JSON before the view is loaded. 在加载视图之前，请使用resolve选项加载JSON。 Documentation. 文档。
For example: 例如：
resolve: {
return $http({method: 'GET', url: '/someUrl'})
.then (function (data) {
return doSomeStuffFirst(data);
});
}
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.