title: Animations in partial views is not working
body: <p>I'm attempting to use ng-view to produce a simple slide effect between views.  I am not sure If  I am doing it right.  The codes is as follows:</p>
  
  <p>Script:  (1.15)</p>
  
  <pre><code>&lt;script src="js/lib/angular-1.1.5/angular.min.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>Routing:</p>
  
  <pre><code>app.config(function ($routeProvider) {
     $routeProvider.
        when("/", { templateUrl: "partials/loading.html" }).
        when("/session", {templateUrl: "partials/session.html", controller: "TimerController" }).
        when("/settings", { templateUrl: "partials/settings.html", controller: "SettingsController" }).
        otherwise({ redirectTo: "/" });
  </code></pre>
  
  <p>HTML containing ng-view and ng-click used to switch views:</p>
  
  <pre><code>&lt;div class="flex-container viewport"&gt;
  
  &lt;div class="flex-item-1"&gt;
  
    &lt;div&gt;
      &lt;button class="overlay btn icon-cog" ng-click="changeView('/settings')" type="button"&gt;&lt;/button&gt;   
    &lt;/div&gt;  
  
  &lt;/div&gt;
  
  
  &lt;div ng-view  class="flex-item-2" ng-animate="{enter: 'enter', leave: 'leave'}"&gt;&lt;/div&gt;
  
  
  &lt;div class="flex-item-3"&gt;
  
    &lt;div&gt;
      &lt;button class="btn btn-5 btn-5a icon-cog"  ng-click="setTimer(3)"&gt;
        &lt;span&gt;3&lt;/span&gt;
      &lt;/button&gt;        
    &lt;/div&gt;
  
    &lt;div&gt;
      &lt;button class="btn btn-5 btn-5a icon-cog"  ng-click="setTimer(5)"&gt;
        &lt;span&gt;5&lt;/span&gt;
      &lt;/button&gt;        
    &lt;/div&gt;
  
    &lt;div&gt;
      &lt;button class="btn btn-5 btn-5a icon-cog"  ng-click="setTimer(10)"&gt;
        &lt;span&gt;10&lt;/span&gt;
      &lt;/button&gt;        
    &lt;/div&gt;
  
    &lt;div&gt;
      &lt;button class="btn btn-5 btn-5a icon-cog"  ng-click="setTimer(15)"&gt;
        &lt;span&gt;15&lt;/span&gt;
      &lt;/button&gt;        
    &lt;/div&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>Controller fn used to switch views:</p>
  
  <pre><code>    $scope.changeView = function (view) {
      $location.path(view);
  };
  </code></pre>
  
  <p>CSS used to implement animation effect:</p>
  
  <pre><code>.enter-setup {
     position:absolute;
     -webkit-transition: 3.3s ease-out all;
     -webkit-transform:translate3d(100%,0,0);
  }
  .enter-setup.enter-start {
     position:absolute;
     -webkit-transform:translate3d(0,0,0);
  }
  .leave-setup {
     position:absolute;
     -webkit-transition: 3.3s ease-out all;
     -webkit-transform:translate3d(0,0,0);
  }
  .leave-setup.leave-start {
     position:absolute;
     -webkit-transform:translate3d(-100%,0,0);
  }
  </code></pre>
  
  <h2>The content still shows (but now with a flicker) and the slide animations do not work.  Any help would be appreciated.</h2>
  
  <p>Update:  I fixed the css syntax to 1.15.  Unfortuneatly it still isn't working.  I'm using flexbox and I'm thinking this is the cause of the problem.  Anyone have similar problems when using ng-animate + flexbox?</p>