ルーティングアニメーション angular

transitionAnimation.ts

const routes: Routes = [
    {path: 'hoge', component: HogeComponent, data: {depth:1}},
    {path: 'foo', component: HogeComponent, data: {depth:2}},
    {path: 'bar', component: HogeComponent, data: {depth:3}},
];

...
@Component({
    template: `
    <!-- getDepth(outlet) -->
    <div class="router-container" [@routeAnimation]="getDepth(outlet)">
        <!-- #outletには NgRouterOutletが(exportAs: 'outlet')なので入っている -->
        <router-outlet #outlet="outlet"></router-outlet>
    </div>`
    animations: [
        trigger('routeAnimation', [
            transition('1 => 2', [
            ])
        ])
    ]
})