Angularで画面に追加したアイコンをスムーズに動かしたい

Angularにて下記のようなHTMLとコンポーネントを用意しています。
IconInfoクラスではiconとicon名を持っています。

画面からボタンを押されると、addIconInfoが呼ばれるようになっており、
ボタンが押されるたびに画面にiconが追加されています。

そこでなのですが、iconが追加される際にアイコンが表示される領域の
一番下から徐々に上に上がっていくように（上にたまっていくように）
したいのですが、何か方法はありますでしょうか？
ngForだけでは難しいでしょうか？

◆HTML

<div class="page">
  <section class="card">
　　<ng-container *ngFor="let icon of icons">
　　　<div class="media">
  　　　<img src={{icon.img}}>
　　　</div>
　　</ng-container>
  </section>
</div>

◆コンポーネント.ts

  addIconInfo(icon: string, name: string) {
     this.icons.push(new IconInfo(icon, name));
  }