ng-if заставляет ссылки отображаться на секунду, а затем исчезает. Как предотвратить показ

Question

ng-if иногда приводит к тому, что ссылки на моей странице отображаются во время загрузки, а затем исчезают.

Ссылка не должна отображаться вообще, и я предполагаю, что оператор ng-if еще не обработан для второго, я могу его увидеть.

Есть ли способ предотвратить отображение ссылки или элемента вообще?

Я также предполагаю, что объект currentClass еще не загружен, поэтому ng-if не может оценить, но я пытаюсь по умолчанию использовать его как скрытый, пока 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

я имел нечто подобное случилось со мной, я в конце концов нашел, что это функция, которая Угловая обеспечивает модуль нг-одушевленные,

explanation

, что в основном происходит, что, когда Оператор ng-if решает, что элемент должен исчезнуть, а не просто удалять его, угловое сначала добавляет элементу класс ng-leave и через несколько секунд удаляет элемент, это делается для того, чтобы вы могли добавлять анимации к элементам, которые удалены из вашего DOM,

я решил эту проблему, добавив селектор CSS:

.ng-leave { 
     display: none; 
     } 

таким образом элемент получает класс, который немедленно удаляет его.

Answer 3

Здесь ссылки кажутся видимыми, поскольку объект DOM по-прежнему содержит элемент ссылки и ng-if, если скрывает вызов CSS только после загрузки страницы. Поэтому лучше сохранить класс CSS ng-cloak, поскольку это показывает обработку элемента пока домен не изменится для загруженной страницы.