能够在Firefox中加载页面之前看到隐藏元素的预览

Question

因此，在我的网页上，我有几个元素应该在初始页面加载时隐藏（如错误消息），但是如果它们满足某些条件则应该显示。我正在使用Angular JS。

问题是虽然它在Chrome中完美运行，但在Firefox中，您可以简单地看到隐藏元素的预览，然后在页面完全加载后消失。我想避免这种情况。

<span id="invalidDate" ng-show="invalidDateEntered==true" class="alert">Invalid Date Format</span>

因此，我可以在页面完全加载到Firefox之前看到此警报Invalid Date Format，但很快就会消失。我尝试使用ng-init来阻止这种情况，但它没有帮助。

<span id="invalidDate" ng-init="invalidDateEntered=false" ng-show="invalidDateEntered==true" class="alert">Invalid Date Format</span>

关于如何解决此问题的任何想法？

Answer 1

在元素上使用ng-cloak： -

<span id="invalidDate" ng-cloak ng-show="invalidDateEntered==true" class="alert">Invalid Date Format</span>

在Css中： -

[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
  display: none !important;
}