ng-如果导致链接显示一秒钟，然后消失.如何防止显示

Question

ng-如果有时会导致我的页面上的链接在加载时间显示，然后消失。

该链接根本不应该显示，我假设ng-if语句尚未处理第二个我可以看到的。

有没有办法防止链接或元素显示出来？

我还猜测当前频道对象尚未加载，因此NG-如果无法评估，但是我试图将其默认为隐藏，直到NG-IF可以解决。

<span ng-if="isFaculty && !currentClass.courseInformation.IsCustomCourse">
<a ng-href="{{$window.BasePath}}lms/class/{{$stateParams.classid}}/instructorguide/download">
<span class="cec-msword-icon"></span>Download Instructor Guide</a> 
<span>| </span>
</span>

Answer 1

使用ng-cloak。它是这样的：

CSS：

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

html：

<div ng-cloak> ... </div>

在您的情况下是：

<span ng-cloak ng-if="isFaculty && !currentClass.courseInformation.IsCustomCourse">
<a ng-href="{{$window.BasePath}}lms/class/{{$stateParams.classid}}/instructorguide/download">
<span class="cec-msword-icon"></span>Download Instructor Guide</a> 
<span>| </span>
</span>

记住：

该指令可以应用于元素，但首选的用法是将多个NGCLOAK指令应用于页面的一小部分，以允许浏览器视图的渐进渲染。

Answer 2

我发生了类似的事情，我最终发现，这是Angular提供的功能，该功能是NG-Animate，

解释

基本上发生的是，当ng-if语句确定元素需要消失而不是仅仅删除它时，Angular首先添加了ng-leave类的元素，并且片刻片刻删除了元素，则完成了此操作。为了允许您将动画添加到从DOM中删除的粒子的元素中，

我通过添加CSS选择器解决了这个问题：

.ng-leave {
        display: none;
      }

以这种方式，元素获得了立即将其删除的类。

Answer 3

在这里，链接似乎可见，因为DOM对象仍然包含链接元素，并且仅在页面加载后才使用hide CSS调用。因此，最好保持NG-Cloak CSS类，由于这显示了元素处理，直到已加载页面更改DOM。