Updating tab badge dynamically on Ionic 2/3

@EVALLEE wrote:

Hi, I’m try to update badge value by using event methode from a provider. It seems ok on Android but not on iOS.

The provider extract

import { Events } from 'ionic-angular';

@Injectable()
export class theProvider{

     constructor( public events: Events ) { }

     oneProviderJob() {
     .
     .
         this.events.publish('cart:updated', 10);
     .
     .
    }

}

And then we subscribe to that event in the page that contains both tabs:

import { Component } from '@angular/core';
import { Events } from 'ionic-angular';

@Component({...})
export class TabsPage {

  allTabs =[];

  constructor(public events: Events) {
       this.allTabs = [
            { root=FirstPage  title="Page one" badge=0 },
            { root=SecondPage  title="Page two" badge=0 }
       ]
       event.subscribe('cart:updated', _badgeValue => {
             this.allTabs[1].badge = _badgeValue;
       });
 }

}

And in the view:

<ion-header>
  <ion-navbar>
    <ion-title>Tabs</ion-title>
  </ion-navbar>
</ion-header>
<ion-tabs #myTabs>
  <ion-tab *ngFor="let tab of allTabs" [root]="tab.root" tabTitle="tab.title" tabBadge="tab.badge"></ion-tab>
</ion-tabs>

Either it is ok on Andoid, it does not work on iOS. On iOS, the bagge will be update only after that the SecondPage works on its view.

Please notice that I use the ionic release. (3.19.0)

Thanks in advance for your help.

Posts: 1

Participants: 1

Read full topic