Se desvanece la animación cuando ng-if = false

¿Hay alguna forma de animar con la desaparición gradual cuando ng-if="false" lugar de ocultar instantáneamente el elemento HTML?

Puedo aparecer cuando ng-if="true" pero no puedo cuando ng-if="false" . Cuando ng-if="true" estoy usando la biblioteca Animate.css para animar con la aparición gradual .

Deberías usar ng-animate para esto. Es una biblioteca angular nativa que agrega clases de transición y un retraso al eliminar elementos

 angular.module('app', ['ngAnimate']). controller('ctrl', function(){}); 
 .fade-element-in.ng-enter { transition: 0.8s linear all; opacity: 0; } .fade-element-in-init .fade-element-in.ng-enter { opacity: 1; } .fade-element-in.ng-enter.ng-enter-active { opacity: 1; } .fade-element-in.ng-leave { transition: 0.3s linear all; opacity: 1; } .fade-element-in.ng-leave.ng-leave-active { opacity: 0; } 
   
Click me
SomeContent
SomeOtherContent

En lugar de usar un ng-if para manejar esta funcionalidad, podría usar el javascript.

Entonces, en su función de Controlador, donde está configurando su ng-si Boolean agrega la clase fadeIn directamente al elemento html allí y si la condición se vuelve falsa, agregue el fadeOut.

Por ejemplo: $ (“div”) .addClass (“fadeIn”);

https://api.jquery.com/addclass/