Angular6 - хранить пользовательскую переменную в сервисе и получать к ней доступ из других компонентов, если она не определена? - PullRequest
0 голосов
/ 14 октября 2018

Итак, я делаю приложение для Angular, и в какой-то момент я хочу сохранить пользовательскую переменную (которую я получил от асинхронного вызова Firestore Cloud), переменная действительно установлена ​​(проверено с помощью console.log ()), нокогда я переключаю страницы и пытаюсь загрузить рецепты этого пользователя в Firestore, он говорит, что моя пользовательская переменная не определена.

Есть ли лучший способ сделать это?

Спасибо

РЕДАКТИРОВАТЬ: Код

tryConnect(email: string, password: string) {
// u = array of users
this.usersWithId.subscribe(u => {
  for (const a of u) {
    console.log(a);
    if (a.email === email && a.password === password) {
      this.connectedUser = a;
      console.log(this.connectedUser);
      break;
    }
  }
});

}

addRecipe(recipe: Recipe) {
console.log(this.connectedUser);
this.db.collection('/recipes').add({
  name: recipe.name,
  description: recipe.description,
  meal: recipe.meal,
  steps: recipe.steps,
  servings: recipe.servings,
  cuisine: recipe.cuisine,
  userID: this.connectedUser.userID,
  ingredients: recipe.ingredients
});

Ответы [ 2 ]

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

Я бы посоветовал вам использовать @angular/fire, если вы его еще не используете.

Вот как вы можете использовать @angular/fire для достижениячто вы пытаетесь.

AngularFireAuth при внедрении в качестве зависимости имеет authState, который имеет тип Observable<firebase.User>.По сути, это состояние вашего текущего пользователя.

Теперь в вашем сервисе вы можете создать приватный BehaviorSubject<Observable<firebase.User>>, для которого next будет вызываться, как только ваш authState изменится.

Затем вы можете выставить это BehaviourSubject<firebase.User> asObservable.Этот Observable является общедоступным, и каждый, кто внедрит ваш сервис в качестве зависимости, будет иметь доступ к user$ и подписаться на него, чтобы получить состояние текущего пользователя, вошедшего в систему.

Вот как это будет выглядеть в коде:

import { AngularFireAuth } from '@angular/fire/auth';
import { Injectable } from '@angular/core';
import { Observable, BehaviorSubject } from 'rxjs';
import { switchMap } from 'rxjs/operators';

import { User } from '@app/shared/models/user.model';

@Injectable()
export class AuthService {

  private user: BehaviorSubject<Observable<firebase.User>> = new BehaviorSubject<Observable<firebase.User>>(null);
  user$ = this.user.asObservable().pipe(switchMap(user => user));

  constructor(
    private afAuth: AngularFireAuth
  ) {
    this.user.next(this.afAuth.authState);
  }

  loginViaCredentails(user: User) {
    return this.afAuth.auth.signInWithEmailAndPassword(user.email, user.password);
  }

  ...

}
0 голосов
/ 14 октября 2018

То, что вы хотите сделать, должно быть достигнуто с помощью rxjs/store или подобным.Rxjs / store - это система управления состоянием, в которой вы можете хранить все что угодно в своем приложении, и это будет актуально везде, где вы его используете.

Также в качестве опции можно использовать sessionStorage или localStorage, если выхотите сохранить его между сеансами.

...