bizfile/src/app/layout/navbar/navbar.component.ts

import { Component, OnDestroy, OnInit } from '@angular/core';
import { Subscription } from 'rxjs';
import { LoginService } from 'src/app/services/login.service';
import { NotificationService } from 'src/app/services/notification.service';

@Component({
  selector: 'app-navbar',
  templateUrl: './navbar.component.html',
  styleUrls: ['./navbar.component.scss']
})
export class NavbarComponent implements OnInit, OnDestroy {
    isShowingNotifications = false;
    showLogout: boolean = false;

    isShowingNotificationsSubscription: Subscription;

    loginName: string = '';
    notificationsCount: number = 0;

    constructor(loginService: LoginService, private notificationService: NotificationService) {
        this.loginName = loginService.getLoginName();
        this.notificationsCount = notificationService.getAllowedNotifications().length;

        this.isShowingNotificationsSubscription = this.notificationService.getIsShowingNotificationsObservable().subscribe(isShowingNotifications => this.isShowingNotifications = isShowingNotifications);
    }

    showNotifications() {
        this.notificationService.setIsShowingNotifications(true);
    }

    ngOnInit(): void {
    }

    ngOnDestroy(): void {
        if (this.isShowingNotificationsSubscription) {
            this.isShowingNotificationsSubscription.unsubscribe();
        }
    }

}