angular 6 Невозможно повторить массив в компоненте приложения при переходе от службы при событии щелчка

Я новичок в angular, у меня есть элемент всплывающего сообщения в компоненте приложения, теперь для каждого вызова службы из любого компонента я вызываю службу для отображения и отправки сообщения в массив. теперь проблема в том, что компонент приложения не может повторить массив и обновить его значение при нажатии или удалении любого объекта. Вот мой код: -

app component.html: -

<div *ngFor="let toast of toastList">
    <div class="toast">
        <span class="close" (click)="closeToast($event)">&times;</span>
        <div class="loading">Loading data {{toastList.message}}<span>.</span><span>.</span><span>.</span></div>
    </div>
</div>

app component.ts: -

ngOnInit() {
    this.subscription = this.commonService.addObject$.subscribe(toasterArray => this.toastList = toasterArray);
    console.log('subscription is : ' + this.subscription);
}

ngOnDestroy() {
    this.subscription && this.subscription.unsubscribe();
}

closeToast($event) {
    this.commonService.toggleToaster(false, null);
}

service.ts: -

export class CommonService {
    private toastArray: any = [];
    private toasterArray: BehaviorSubject<any> = new BehaviorSubject<any>(this.toastArray);

    addObject$: Observable<number> = this.toasterArray.asObservable();

    constructor() {
    }

    toggleToaster = (action, message) => {
        if (action === true) {
            this.toastArray.push(message);
            this.toasterArray.next(this.toastArray);
        } else if (action === false) {
            this.toastArray = this.toastArray.filter(element => element.message !== message);
            this.toasterArray.next(this.toastArray);
        }

    }
    getToastArray = () => {
        return this.toastArray;
    }
}

component.ts для вызова службы для отображения тоста: -

getPass() {
    this.membeService.getPass(this.page).subscribe(
        data => {
            let toaster = { "message": this.page.searchParams };
            this.commonService.toggleToaster(true, { 'message': 'get Passenger' });
        },
        err => {
            console.error(err);
        }
    )
};

Помоги мне