в этом документе есть пример анимации ng-if: https://docs.angularjs.org/api/ng/directive/ngIf если вы быстро и многократно нажмете этот флажок, вы обнаружите, что отобразится более одного элемента, я не знаю, как его избежать.
Быстрый выход и вводят несколько элементов в angular ng-if animation
Ответ 1
Это происходит потому, что ngIf ведет себя иначе, чем ngShow. ngShow просто добавляет стиль display: none к элементу, который должен быть скрыт, а ngIf выполняет следующие действия:
Директива ngIf удаляет или воссоздает часть дерева DOM на основе {выражения}. Если выражение, назначенное ngIf, оценивает к ложному значению, тогда элемент удаляется из DOM, в противном случае клон элемента повторно вставлен в DOM.
Итак, если анимация занимает немного времени, в DOM будет больше одного элемента.
В примере Olivvv, если вы просто измените задержку .animate-if.ng-enter, .animate-if.ng-leave на 0.001s, вы увидите, что вы не можете получить более одного элемента.
Здесь вы видите, что это разветвленная версия официальной документации AngularJS. http://plnkr.co/edit/ok7nwOIRpR1TYYRkBRXj?p=preview
Я только изменил его задержку от 0.5s до 0.001s