AngularJS 策略来防止类的无样式内容闪现 [英] AngularJS strategy to prevent flash-of-unstyled-content for a class
问题描述
我有一个 AngularJS 项目，我想在类名的页面加载期间防止 FOUC.我读过关于 ng-template 的内容，但这似乎只对标签内的内容有用.
I have an AngularJS project, I want to prevent a FOUC during page load on a classname. I've read about ng-template but that seems useful only for content within a tag.
<body class="{{ bodyClass }}">
我希望它在页面加载时登录".对此有什么策略吗?或者我是否只需要捏造它并将其加载为登录"，然后手动使用 javascript 为这个实例调整 DOM.
I would like it to be "login" on page load. Any strategy for this? Or do I just have to fudge it and load it as 'login' and manually use javascript to to tweak the DOM just for this instance.
推荐答案
您正在寻找的是 ng-cloak.
你必须像这样添加它:
What you are looking for is ng-cloak.
You have to add it like this:
<body class="{{ bodyClass }}" ng-cloak>
这将防止不必要的闪烁.
相关文档的链接.
and this will prevent unwanted flashing.
Link to docs about this.
根据文档，还建议将下面的代码片段放入您的 CSS 文件中.
It is also advisable to put the snippet below into your CSS file, according to docs.
"为了获得最佳效果，必须在头部加载angular.js脚本html 文档的部分；或者，上面的 css 规则必须包含在应用程序的外部样式表中."
"For the best result, the angular.js script must be loaded in the head section of the html document; alternatively, the css rule above must be included in the external stylesheet of the application."
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
display: none !important;
}
这篇关于AngularJS 策略来防止类的无样式内容闪现的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
