angular2 ng-bootstrapタブにフェード効果を追加

Question

誰でもng-bootstrapタブにフェーディング効果を追加するのを助けることができます。 https://ng-bootstrap.github.io/#/components/tabs

Answer 1

あなたはこのようなことを求めていますか？ ：

@Component({ 
    selector: 'your_component', 
    animations: [ 
    trigger('fadeInOutTranslate', [ 
     transition(':enter', [ 
     style({opacity:0}), 
     animate(300, style({opacity:1})) 
     ]), 
     transition(':leave', [ 
     style({transform: 'translate(0)'}), 
     animate(300, style({opacity:0})) 
     ]) 
    ]) 
    ], 
    template: '<div [@fadeInOutTranslate] class="container"></div>', 
}) 

は場合にimport { transition, animate } from '@angular/core';

を追加することを忘れないでください：https://angular.io/docs/ts/latest/guide/animations.html