How to update or change the value in custome component form home.ts?

#1

I need to update the notification badge. so I create the my-notification component. because of the need to show on every page.
here is my my-notification.ts

import { Component, Input, Output, EventEmitter } from '@angular/core';

@Component({
  selector: 'my-notificationbadge',
  templateUrl: 'my-notificationbadge.html'
})
export class MyNotificationbadgeComponent {
  @Input("mytext") texttouse;
  @Output() somethingHappen=new EventEmitter();
  number: number;

  constructor() {
    console.log('Hello MyNotificationbadgeComponent Component');
    this.number= 0;
  }
  ngAfterViewInit(){
    this.number=this.texttouse;
    let interval= setInterval(()=>{
      this.somethingHappen.emit();
      console.log("check");
    },3000);
  }
}

my-notification.html

<button id="notification-button" ion-button clear>
    <ion-icon name="notifications">
      <ion-badge id="notifications-badge" color="danger">{{number}}</ion-badge>
    </ion-icon>
  </button>

my home.ts

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

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
  myhometext:number=1;
  hh:number;
  constructor(public navCtrl: NavController) {
  }
  dosomething(){
   this.myhometext= this.myhometext+1;
   this.hh=this.myhometext;
    console.log(this.myhometext);
    console.log("check my log");
  }

}

my home.html

<ion-header>
  <ion-navbar>
    <button ion-button menuToggle="left">
      <ion-icon name="menu"></ion-icon>
    </button>
    <ion-title ion-center>ttmind Quiz</ion-title>
    <button ion-button menuToggle="right" right>
        <my-notificationbadge [mytext]="myhometext" (somethingHappen)="dosomething()"></my-notificationbadge>
    </button>
  </ion-navbar>
</ion-header>
<ion-content padding>
  
</ion-content>

dosomething() function is call but not change. how to change it.