Multiple versions of service despite being provided in root

I have a component that is supposed to display the number of unread notifications and this value is stored in my service as unread.

@Injectable({
  providedIn: 'root'
})
export class NotificationService implements OnDestroy {

  base_url: string;
  auth_token: string;
  headers: HttpHeaders;

  private notifications = new BehaviorSubject<Notification[]>([])
  notifications$ = this.notifications.asObservable()

  private unread = new BehaviorSubject<Notification[]>([])
  unread$ = this.unread.asObservable()
  unreadSubscription: Subscription;

  private read = new BehaviorSubject<Notification[]>([])
  read$ = this.read.asObservable()

  constructor(private global: GlobalsService,
              private http: HttpClient,
              private storage: Storage,
              private auth: AuthService ) {

    this.base_url = this.global.base_url;
  }

  ngOnDestroy() {
    if (this.unreadSubscription) this.unreadSubscription.unsubscribe()
  }

  setNotifications(notifications : Notification[]) {
    console.log("setNotifications", notifications)
    this.notifications.next(notifications)
    this.storage.set('notifications', notifications)
    let arr = _.filter(notifications, { read_at: null })
    this.unread.next(arr)
  }
}

In my view, I display the number of unread notifications:

client-detail.page.html

<ion-header>
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-back-button (click)="goBack()" defaultHref="clients">
      </ion-back-button>
    </ion-buttons>
    <ion-title>Title</ion-title>
    <ion-buttons slot="end">
      <logout-component></logout-component>
    </ion-buttons>
  </ion-toolbar>
</ion-header>

logout.component

<span>
  <ion-button (click)="signOut()">
    <ion-icon name="person" style="font-size:32px;"></ion-icon>
    <span class="ion-padding-start" style="vertical-align: super;">{{email}}</span>
  </ion-button>
  <ion-badge *ngIf="( notificationsService.unread$ | async ).length > 0">
    {{ ( notificationsService.unread$ | async ).length }}
  </ion-badge>
</span>

export class LogoutComponent implements OnDestroy, OnChanges {
    @Input() color: string;
    @Output() showHelp: EventEmitter<any> = new EventEmitter();
    @Output() hideHelp: EventEmitter<any> = new EventEmitter();

    currentUserSubscription: Subscription;
    notificationsSubscription: Subscription;

    constructor(private storage: Storage,
              private actionSheetCtrl: ActionSheetController,
              private clientService: ClientService,
              private globalService: GlobalsService,
              private navCtrl: NavController,
              private modalCtrl: ModalController,
              private notificationsService: NotificationService,
              public auth: AuthService,
              private router: Router) {
    }
}

For some reason, even after calling NotificationService.setNotifications() and seeing that the notifications and unread notifications are being updated and can be displayed, when I inspect the NotificationService in the LogoutComponent, it's values for notifications$ and unread$ remain unchanged. It's almost as if the LogoutComponent is treating the NotificationService as a singleton.

It might be worth noting that the LogoutComponent and NotificationService are in different modules but both should be present in AppModule.