Почему наблюдаемый AngularFire не завершается в преобразователе маршрута? - даже после .pipe(take(1))

В моем приложении Angular я использую преобразователь маршрута для возврата объекта «ресторан». Однако, когда я загружаю маршрут, кажется, что наблюдаемое не завершается. Я добавил .pipe(take(1)), чтобы убедиться, что он завершен, но это не работает.

Может ли кто-нибудь помочь мне определить, что я делаю неправильно?

ресторан.resolver.ts

import { Inject, Injectable, PLATFORM_ID } from '@angular/core';
import { ActivatedRouteSnapshot, Resolve, RouterStateSnapshot } from '@angular/router';
import {  Observable } from 'rxjs';
import {  TransferState } from "@angular/platform-browser";
import { Restaurant } from '../restaurants/Interfaces.model';
import { AngularFirestore } from '@angular/fire/firestore';
import { first, take } from 'rxjs/operators';
import { OrderFormService } from '../restaurants/order-form.service';

@Injectable()
export class RestaurantResolver implements Resolve<Restaurant> {

    constructor(
        public afs: AngularFirestore,
        private transferState: TransferState,
        public orderForm: OrderFormService,
        @Inject(PLATFORM_ID) private platformId) {

    }

    resolve(route: ActivatedRouteSnapshot,
        state: RouterStateSnapshot): Observable<any> {

            let restaurant = this.afs.doc('restaurants/thaiHouse').valueChanges().pipe(take(1)) 
            console.info('e', restaurant)
            return restaurant

    }
}

Вы используете valueChanges(), но действительно ли он излучает хотя бы один раз? Кстати, почему вы думаете, что это не завершено?

martin 24.12.2020 22:40

@martin Из-за оператора console.info я знаю, что он выдает. Итак, я запускаю приложение, перехожу прямо к этому маршруту, а затем оно регистрирует объект ресторана, а затем просто зависает (также без тайм-аута). Браузер просто вращается, поэтому единственное, что имеет смысл, это то, что этот наблюдаемый объект не завершается.

Marcus Gallegos 24.12.2020 22:53

Но журнал консоли не означает, что Observable испускает. Он просто выводит объект Observable на консоль. Попробуйте использовать, например, оператор tap() в цепочке, чтобы увидеть, действительно ли он излучает (tap(v => console.info(v))).

martin 24.12.2020 22:58

Я не уверен, что сделал это так, как вы предполагали, но он печатает объект, когда я делаю это: let restaurant = this.afs.doc('restaurants/thaiHouse').valueChanges().pipe( tap(v = > console.info('v', v)), взять(1))

Marcus Gallegos 24.12.2020 23:07

Да это оно. Если он регистрируется, то take(1) завершает цепочку, поэтому, если он выглядит так, как будто это не так, проблема будет где-то еще.

martin 25.12.2020 09:52

@martin оказывается, это известная проблема с библиотекой. Спасибо за помощь. github.com/angular/angularfire/issues/2695

Marcus Gallegos 26.12.2020 22:10
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Angular и React для вашего проекта веб-разработки?
Angular и React для вашего проекта веб-разработки?
Когда дело доходит до веб-разработки, выбор правильного front-end фреймворка имеет решающее значение. Angular и React - два самых популярных...
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Мы провели Twitter Space, обсудив несколько проблем, связанных с последними дополнениями в Angular. Также прошла Angular Tiny Conf с 25 докладами.
Угловой продивер
Угловой продивер
Оригинал этой статьи на турецком языке. ChatGPT используется только для перевода на английский язык.
Мое недавнее углубление в Angular
Мое недавнее углубление в Angular
Недавно я провел некоторое время, изучая фреймворк Angular, и я хотел поделиться своим опытом со всеми вами. Как человек, который любит глубоко...
Освоение Observables и Subjects в Rxjs:
Освоение Observables и Subjects в Rxjs:
Давайте начнем с основ и постепенно перейдем к более продвинутым концепциям в RxJS в Angular
0
6
107
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Это известная проблема с библиотекой Angularfire. Надеюсь, это скоро будет исправлено. См. проблему, задокументированную здесь: https://github.com/angular/angularfire/issues/2695

Другие вопросы по теме