How to increment badge in the tabs


#1

I try to change the value of the badge if a notification comes, but I do not come to the exchange if you have an idea you could help me
tabs.ts

import { Component, ViewChild } from '@angular/core';

 import { SQLite, Dialogs, Firebase } from 'ionic-native';
import { NavController, Platform, Tabs } from 'ionic-angular';
import { HomePage } from '../home/home';
import { NotificationPage } from '../notification/notification';
import { MessagesPage } from '../messages/messages';
import { MoiPage } from '../moi/moi';

import {GlobalVars} from '../../providers/varglobal'
import {Injectable} from '@angular/core';

@Injectable()

@Component({
 templateUrl: 'tabs.html'
})

export class TabsPage {

@ViewChild('myTabs') tabRef: Tabs;
public database: SQLite;
public people: Array<Object>;
public home:any='';


 tab1Root: any = HomePage;
 tab3Root: any = NotificationPage;
 tab4Root: any = MessagesPage;
  tab5Root: any=MoiPage;

 constructor(private platform:Platform,private nav:NavController,public lan: GlobalVars) {
 this.platform.ready().then(() => {
          Firebase.onNotificationOpen()
  .subscribe(res => {
if(res.tap) {
  // background mode
  console.log(res.tap);
  console.log(res);


} else if (!res.tap) {
  // foreground mode



let num=parseInt(this.lan.getbadgeHome());
 num=num+1;
 alert(num+' home');
 this.home=num;  
 alert(this.home);  





}
 });

    });




}

tabs.html

 <ion-tabs  color="primary">


 <ion-tab [root]="tab1Root"  tabIcon="home" tabBadge="{{home}}" tabBadgeStyle="danger"></ion-tab>
<ion-tab [root]="tab4Root"  tabIcon="mail" tabBadgeStyle="danger"></ion-tab>
<ion-tab [root]="tab5Root"  tabIcon="person" ></ion-tab>

 </ion-tabs>

In fact I manage to retrieve the notification and to increment the variable num and put it in the variable home but the value of the badge does not change


#2

You should do:

[tabBadge]="getBadgeValue()"

and not:
tabBadge="{{home}}"

Have a look here:

How to update Ionic 2 Tabs Badges