<matTabContent> не показывает никаких данных в IE11, в то время как для Chrome он работает как шарм

Question

Я использую Angular 8 и Angular Материал

С Google Chrome работает нормально, когда я открываю в IE11, нажимая только на любую вкладку mat-tab-label осталось, но содержимое скрыто.

Я пробовал много вещей, но мне не повезло.

<mat-tab-group class="form-wizard" [(selectedIndex)]="selectedIndex"
(selectedTabChange)="onTabChanged($event)">
//tab 1
<mat-tab>
  <ng-template mat-tab-label>
    <div fxLayout="row" fxLayoutAlign="center center" fxLayoutGap="8px">
      <span class="badge primary">1</span>
      <span>Family’s Expenses</span>
    </div>
  </ng-template>
  <div class="row row-border" >
    <div class="col-lg-8 col-md-12 mb-lg-0 mb-3">
      Final expenses 
      <a style="cursor:pointer" (click)="showDialog('cash1')" class="red-more">Read more</a>
    </div>
    <div class="col-lg-4 col-md-12">
      <input class="text" currencyMask [options]="{allowNegative :false ,precision: 0 }"
        (keyup)="onBlur($event)">
    </div>
  </div>

</mat-tab>
//tab 2
<mat-tab>
  <ng-template mat-tab-label>
    <div fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="8px">
      <span class="badge primary">2</span>
      <span>Total Annual Income</span>
    </div>
  </ng-template>
  <div class="row row-border">
    <div class="col-lg-9 col-md-12 mb-lg-0 mb-3">
      Monthly income to take care of your family
      <a style="cursor:pointer" (click)="showDialog('income1')" class="red-more">Read more</a>
    </div>
    <div class="col-lg-3 col-md-12">
      <input class="text" currencyMask [options]="{allowNegative :false ,precision: 0 }"
        (keyup)="onBlur($event)">
    </div>
  </div>
</mat-tab>
</mat-tab-group>