Update UI to not render BCF files that are not active

Dangl-IT · Apr 5, 2024 · e1e1cce · e1e1cce
1 parent 5fc960a
commit e1e1cce
Showing 1 changed file with 5 additions and 2 deletions.
diff --git a/src/ipa-bcfier-ui/src/app/app.component.html b/src/ipa-bcfier-ui/src/app/app.component.html
@@ -4,7 +4,7 @@ <h1 class="title"><strong>IPA.</strong>BCFier</h1>
 </mat-toolbar>
 
 <mat-tab-group *ngIf="bcfFiles" dynamicHeight #tabGroup>
-  <mat-tab *ngFor="let bcfFile of bcfFiles | async">
+  <mat-tab *ngFor="let bcfFile of bcfFiles | async; let index = index">
     <ng-template mat-tab-label>
       {{ bcfFile.fileName }}
       <button
@@ -16,6 +16,9 @@ <h1 class="title"><strong>IPA.</strong>BCFier</h1>
         <mat-icon>close</mat-icon>
       </button>
     </ng-template>
-    <bcfier-bcf-file [bcfFile]="bcfFile"></bcfier-bcf-file>
+    <bcfier-bcf-file
+      [bcfFile]="bcfFile"
+      *ngIf="tabGroup.selectedIndex === index"
+    ></bcfier-bcf-file>
   </mat-tab>
 </mat-tab-group>