Hello I would like to switch the tabs according to a certain page, I tried a simple way using ngif that worked to hide the links but the icon that starts hidden after it is shown does not work when changing the screen, it seems to me that the links have to work to be active when loading the page, does anyone have a solution?

I'm using this code

tabs.page.html

<ion-tabs >

  <ion-tab-bar slot="bottom" >
    
    <ion-tab-button tab="templates" *ngIf="activeTab === 1">
      <i class="fi fi-rr-apps"></i> 
      <ion-label>Templates</ion-label>
    </ion-tab-button>

    <ion-tab-button tab="design" (click)="setActiveTab(2)" *ngIf="activeTab === 1">
      <i class="fi fi-rr-picture"></i>
      <ion-label>Criar</ion-label>
    </ion-tab-button>

    <ion-tab-button  (click)="setActiveTab(1)" *ngIf="activeTab === 2">
      <i class="fi fi-sr-add"></i> 
    </ion-tab-button>
    
    <ion-tab-button tab="projects" *ngIf="activeTab === 1">
      <i class="fi fi-rr-star"></i> 
      <ion-label>Meus Projetos</ion-label>
    </ion-tab-button>
  </ion-tab-bar>
  
</ion-tabs>

tabs.page.ts

export class TabsPage implements OnInit {

 activeTab = 1;

  constructor() { }

  ngOnInit() {
  }

  setActiveTab(tabIndex: number) {
    this.activeTab = tabIndex;
  }

}