How to set "search" icon in the navigation tab bar in Ionic?

Question

I'm working on an Ionic project and I want to set the "search" icon in the tab bar of my navigation. Here's what I've tried so far:

<ion-tabs>
   <ion-tab [root]="tab1Root" tabTitle="Home" tabIcon="home" [rootParams]="apiuser"></ion-tab>
  <ion-tab [root]="tab3Root" tabTitle="Search" tabIcon="ion-md-search" [rootParams]="apiuser"></ion-tab>
  <ion-tab [root]="tab5Root" tabTitle="Search" tabIcon="md-search" [rootParams]="apiuser"></ion-tab>
  <ion-tab [root]="tab6Root" tabTitle="Search" tabIcon="search" [rootParams]="apiuser"></ion-tab>
</ion-tabs>

The result:

I don't know why the icon is not displayed.

I've attempted to use various icon names such as "ion-md-search", "md-search", and "search" for the tabIcon property, but none of them seem to work as expected. Can someone please provide guidance on how to correctly set the "search" icon in the tab bar of my Ionic application? My Ionic CLI version is 5.4.16, and I'm using Ionic Framework 3.9.4. I know that is very old version but i don't want to update it

---

The versions that I use:

Ionic:

   Ionic CLI          : 5.4.16 
   Ionic Framework    : ionic-angular 3.9.4-201903121725
   @ionic/app-scripts : 3.2.4

Cordova:

   Cordova CLI       : not installed
   Cordova Platforms : android 8.1.0
   Cordova Plugins   : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 4.0.1, (and 23 other plugins)

Utility:

   cordova-res : not installed
   native-run  : 0.3.0

System:

   NodeJS : v14.18.1 (C:\Program Files\nodejs\node.exe)
   npm    : 6.14.15
   OS     : Windows 10

Answer 1

1. npm install ionicons

2. import { Ionicons } from 'ionicons/icons';

 <ion-tabs>
  <ion-tab [root]="tab3Root" tabTitle="Search">
    <ion-icon name="search"></ion-icon>
  </ion-tab>
  <!-- Other tabs -->
</ion-tabs>

Answer 2

Use ion-tab-bar and ion-tab-button. something like this:

<ion-tabs>
  <ion-tab-bar>
    <ion-tab-button tab="search">
      <ion-icon name="search"></ion-icon>
      <ion-label> Search </ion-label>
    </ion-tab-button>
     ....
  </ion-tab-bar>
</ion-tabs>