How can I use ng-animate with ui-view rather than ng-view?

Question

I am using angular-ui-router with angularJS v1.2 and would like to implement custom page transitions.
How can I use ng-animate with ui-view (from angular-ui-router) rath

Answer 1

Using AngularMotion https://github.com/mgcrea/angular-motion then just add this to your css...

div[ng-view].ng-leave-active {
    display: none !important;
}

Add your animation to the class (am-fade in my case) of your ng-view div

Answer 2

Over the weekend, I created two plunks demonstrating view animations for both ui-view and ng-view

ui-view: http://plnkr.co/edit/jpebBk?p=preview

ng-view: http://plnkr.co/edit/LQhVYU?p=preview

angular-ui-router 0.2.8 came with fixes to major view animation bugs