Как изменить маршрут и заставить работать observable?

Я пытаюсь загрузить информацию из наблюдаемого, когда я ввожу маршрут, он загружается правильно, но когда я меняю маршрут с помощью routerLink, наблюдаемый перестает показывать информацию с асинхронным каналом.

То, как я показываю информацию об наблюдаемом, выглядит так:

Компонент профиля

<ng-container *ngIf="this.observable| async as profilevar; else loading">
    <div class="main-content">
        <div class="profile-content shadow">
            <div class="profile-content-top">
                <div class="profile-image">
                    <div class="profile-image-avatar">
                        <img src="{{ profilevar?.profile_url }} "

Вот компонент, содержащий элементы для изменения маршрута:

Компонент панели навигации

<div class="nav-bar-mobile">
    <div class="element-bar profile" routerLink="/profile" routerLinkActive="selecteditem">
        <i class="fas fa-user-circle"></i>
    </div>
    <div class="element-bar settigs" routerLink="/settings" routerLinkActive="selecteditem">
        <i class="fas fa-cog"></i>
    </div>
</div>

Что работает:

  • Загрузите данные, перейдя непосредственно из пути браузера

Что не работает:

  • Когда я меняю свой маршрут, используя компонент navbar и routerLink

Переменная this.observable содержит this.db.object('/profiles/' + vid).valueChanges()

Как я могу решить эту проблему?


firebase angular asynchronous observable routerlink
person danielvalred    schedule 19.07.2020    source источник

Ответы (1)


arrow_upward
0
arrow_downward

РЕШЕНО

После изучения я нашел решение моей проблемы!

Мне удалось решить эту проблему, назначив мою наблюдаемую переменную типа подписки.

    export class ProfileComponent implements OnInit, OnDestroy {

        subscriptionObservable: Subscription;
        observable: Observable<Profile>;
        
        constructor(){
            this.subscriptionObservable = this.observable.subscribe((data: Profile) => 
            {...}));
        }
    
        ngOnDestroy() {
            if (this.subscriptionObservable) {
            this.subscriptionObservable.unsubscribe();
            }
        }
    }

Как только я заканчиваю работу с компонентом, я отписываюсь от подписки на переменную SubscribeObservable!

person danielvalred    schedule 23.07.2020