Angular: подписка ничего не делает при вызове функции - PullRequest
Новая
       18

Angular: подписка ничего не делает при вызове функции

0 голосов
/ 14 ноября 2018

У меня есть компонент, в котором я использую параметры маршрута для переключения «вкладок».Я подписан на параметры маршрута, поэтому всякий раз, когда я переключаюсь между вкладками, я вызываю функцию для этой вкладки.Вот одна из функций: 

getUserFeed() {
console.log('testUser');
this.currentTab = "2";
this.loading = true;

this.authService.userData$.subscribe(data => {
  this.user = data;

  this.userAsteroid$ = this.userAsteroidService.getAsteroids();
  this.userAsteroid$.subscribe(asteroids => {
    this.asteroidIds = [];

    asteroids.forEach(document => {
      if (document.userId == this.user.uid) {
        this.asteroidIds.push(document.asteroidId);
      }
    });

    this.asteroidIds.forEach(asteroidObservable => {
      console.log("test:", asteroidObservable);
      var data$;
      data$ = this.neoService.getLookup$(asteroidObservable);

      data$.subscribe(asteroid => {
        this.dataArray.push(asteroid);
      });
    });

    this.loading = false;
    console.log("data & asteroids", this.dataArray, this.asteroidIds);
  });
});

Эта функция отлично работает при первом вызове, но при повторном вызове все в подписке this.authService.userData$.subscribe(data => {} просто не происходит.Даже консольный журнал со строкой ничего не делает.

Кроме того, когда я перезагружаю страницу в браузере, все в this.authService.userData$.subscribe(data => {} происходит дважды.

Кто-нибудь знает, что вызывает это?

РЕДАКТИРОВАТЬ

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

Я использую систему аутентификации firebase.Мой сервис аутентификации: 

userData$: BehaviorSubject<User> = new BehaviorSubject(null);

constructor(private afAuth: AngularFireAuth) {
  this.afAuth.authState.subscribe((user) => {
     this.setUserData(user);
  });
 }

private setUserData(user) {
if (user !== null) {
  this.userData$.next({
    uid: user.uid,
    displayName: user.displayName || user.email,
    photoURL: user.photoURL || '/assets/icons/icon-72x72.png',
    email: user.email,
  });
} else {
  this.userData$.next(null);
}

1 Ответ

0 голосов
/ 14 ноября 2018

Решено благодаря комментаторам.

Прежде всего, чтобы избежать получения данных 2 раза, мне пришлось поместить большую часть кода вне подписки userData $.Затем мне пришлось поместить свой getUserFeed () в ngOnInit (), чтобы он не вызывался каждый раз, когда я меняю вкладки.Я также должен отписаться от userAsteroid $, когда я снова посещаю страницу и снова вызываю функцию.

Теперь это выглядит так 

ngOnInit() {
this.authService.userData$.subscribe(data => {
  this.user = data;
});
this.getUserFeed();}

this.getUserFeed(){
   this.userAsteroid$ = this.userAsteroidService.getAsteroids();
   this.astroSub = this.userAsteroid$.subscribe(asteroids => {
   this.asteroidIds = [];

   asteroids.forEach(document => {
      if (document.userId == this.user.uid) {
         this.asteroidIds.push(document.asteroidId);
      }
   });

   this.asteroidIds.forEach(asteroidObservable => {
      console.log("test:", asteroidObservable);
      var data$;
      data$ = this.neoService.getLookup$(asteroidObservable);

      data$.subscribe(asteroid => {
        this.dataUserArray.push(asteroid);
      });
   });

   this.loading = false;

   this.astroSub.unsubscribe();
   console.log("data & asteroids", this.dataUserArray, this.asteroidIds);
});}
...