ang2でアニメーションを使ってdivを表示する方法は？

Question

私は、Facebook上でTwitterの共有オプションを含むDivが表示される共有イメージを持っていますが、このDivにフェードアニメーションが表示されます。

はここに私のHTMLコードです： -

<img class="like_2" alt="image" (click) = "shareIt(i)" src="assets/img/Fwd Icons/share.png"> 
<div class="row" *ngIf="sharing==i"> 
    <section class="widget"> 
     <share-buttons (click) = "closeShareIt(i)" [url]=" myFeed.contentUrl " 
      [count]="false" 
      [totalCount]="true" 
      [defaultStyle]= "true" 
      (popUpClosed) = "true" 
      [google]="googleInner" 
      [pinterest]="false" 
      [linkedIn]="false" 
      [tumblr]="tumblrInner" 
      [reddit]="false" 
      [stumbleUpOn]="false"> 
     </share-buttons>     
    </section> 
</div> 

Answer 1

あなたはドキュメントをアニメーションAngular2で見ることができます。あなたが行うには本当に簡単な何かを探しているなら、

https://angular.io/docs/ts/latest/guide/animations.html

しかし、その後、ちょうどこのようなものを使用。..コンポーネントのクラスで、その後

<div [ngClass]="{'animator': gogogo}" class="myel">i will animate</div> 

を...

gogogo=false; 

ngOnInit() { 
    setTimeout(() => { 
    this.gogogo=true; 
    }, 1000); 
} 

あなたのCSSで。

.myel { 
    opacity:0; 
} 

.myel.animator { 
    opacity:1; 
    transition:opacity 2s ease-in; 
}