Ionic Native Badge showing as [object Object] when called in html

Question

So I wanted to show the value of badge from ionic native badge in a tab but it will only show as [object Object].

Here is my HTML

<ion-tab [root]="tab3Root" 
  tabTitle="Notifications" 
  tabIcon="notifications" 
  tabBadge="{{ badge }}" 
  tabBadgeStyle="danger">
</ion-tab>

Here is my code

async increaseBadges(){
    try{
        let badge = await this.badge.increase(Number(1));
        let alert = this.alertCtrl.create({
            title: String(badge),
            buttons: ['OK']
         });
         alert.present();
         console.log(badge);
    } catch (e) {
         console.error(e);
    }
}

Why is badge showing as [object Object] instead of the badge value?