title: Using ngAnimate with ng-show/ng-hide
body: <p>I have this html:</p>
  
  <pre><code>  &lt;div ng-if="true"&gt;
      &lt;div ng-show="hideMe"&gt;
        &lt;div class="random" ng-include="'template.html'"&gt;&lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  
    &lt;br&gt;
    &lt;button ng-click="hideMe = false"&gt;hide&lt;/button&gt;
    &lt;button ng-click="hideMe = true"&gt;show&lt;/button&gt;
  </code></pre>
  
  <p>And then I have this styling:</p>
  
  <pre><code>.random.ng-enter {
    transition: 2s ease all;
    opacity: 0;
    transform: translateY(100%);
  }
  
  .random.ng-enter.ng-enter-active {
    opacity: 1;
    transform: translateY(0);
  }
  
  .random.ng-leave {
    transition: 10s ease all;
    opacity: 1;
    transform: translateX(0);
  }
  
  .random.ng-leave.ng-leave-active {
    opacity: 0;
    transform: translateX(50%);
  }
  </code></pre>
  
  <p>The template: </p>
  
  <pre><code>&lt;p&gt;a simple paragraph&lt;/p&gt;
  
  &lt;div ng-repeat="user in info"&gt;
    {{user.nome}}
  
  &lt;/div&gt;
  </code></pre>
  
  <p>When I first load the page, the ng-enter-active works perfectly, but when I use the buttons Hide or Show the ng-enter and ng-leave don't work. 
  Anyone knows what I'm missing?</p>
  
  <p>Thank you :)</p>
  
  <p>Here you have a plunker showing what I just exposed.</p>
  
  <p><a href="https://plnkr.co/edit/kNy30wKM9gA848k9ByPL?p=preview" rel="nofollow noreferrer">DEMO</a></p>