5
votes

Convertir Observable en valeur booléenne

Ceci n'est pas une copie de ceci a> pour plusieurs raisons. 1. J'utilise angulaire 7 et non angulaire 2. 2. J'utilise rxjs6 et non rxjs5. Je n'ai aucun avantage à apprendre ces versions antérieures car elles sont éteintes. 3. Je pose une question sur un concept Observable (booléen) lorsque cette question ne mentionne pas Observable (booléen)

J'ai créé une valeur Observable que je veux vrai / faux. Voici mon code dans le fichier nav.component.ts

am i logged in ObservableÂ {_isScalar: false, source: BehaviorSubject}
               source: BehaviorSubject {_isScalar: false, observers: 
               Array(0), closed: false, isStopped: false, hasError: 
               false, â€¦}
               _isScalar: false ...

La sortie de la console est:

export class NavComponent implements OnInit {
  private $loggedin: Observable<boolean>;

  constructor( private auth: AuthenticationService){}
  ngOnInit() {
    this.$loggedin = this.auth.$isLoggedinSource;
    console.log('am i logged in ', this.$loggedin);
  }

Comment puis-je obtenir une valeur booléenne, vrai / faux sur $ connecté?

angular

5 commentaires

Copie possible de Comment obtenir la valeur actuelle du sujet RxJS ou Observable?

Il n'y a aucune relation entre la bibliothèque rxjs et angular. Votre question est entièrement traitée dans l'indicateur de duplication. si $ isLoggedinSource est un BehaviorSubject comme le suggère votre balise, alors vous pouvez simplement obtenir la valeur this.auth. $ isLoggedinSource.getValue ();

Florian, je n'utilise ni angular2 ni rxjs5 dans mon application. Je n'ai pas envie d'apprendre cette technologie dépassée. Je suis à la fine pointe avec angular 7 et rxjs6. Ceci est ma première application. La question a deux ans. Une vie dans le développement de logiciels. BehaviorSubject n'est pas mentionné dans cette question.

1. rxjs est juste une bibliothèque, rxjs6 a remplacé rxjs5, mais votre question ne concerne pas une fonctionnalité spécifique de rxjs6. 2. votre question a deux balises: angular et behaviorubject , donc oui, BehaviorSubject est mentionné ici.

BehaviorSubject n'est PAS mentionné dans la question à laquelle vous faites référence. J'ai obtenu une réponse de pointe à cette question. Je suis content. J'espère qu'une autre personne trouve cette réponse actuelle également utile.

4 Réponses :

2
votes

Vous devez vous y abonner. Maintenant, vous enregistrez l'objet Observable lui-même, mais ce que vous devez faire est de vous y abonner afin que, lorsqu'il sera résolu, votre abonnement l'écoutera puis imprimera ce qu'il résout.

0 commentaires

1
votes

Vous devez vous abonner aux observables pour obtenir les données.

ceci. $ connecté.subscribe ((data: boolean) => { console.log («suis-je connecté», données); }

1 commentaires

Vous n'êtes pas obligé de définir le type du paramètre data comme booléen . Cela devrait déjà être fait pour vous lorsque vous avez converti Observable en un type d'union de boolean .

9
votes

Vous pouvez utiliser deux méthodes pour dérouler la valeur d'un observable.

En utilisant le tube async dans votre modèle:

Suis-je connecté: {{$ isLoggedinSource | async}}

En vous abonnant à l'Observable dans votre composant:

import { Subscription } from 'rxjs';

...

subscription: Subscription;

...

this.subscription = this.$loggedin
  .subscribe(data => console.log('am i logged in ', data));

...

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

Lequel utiliser?

Si cet observable $ connecté est récurrent, et que vous utilisez l'approche 2, vous devrez l'attribuer à une propriété de type Subscription , puis appeler unsubscribe dessus dans le ngOnDestroy .

Avec la première approche, vous n'êtes pas vraiment obligé de le faire.

1 commentaires

SiddAjmera, Merci pour la réponse exceptionnelle. Je n'ai même jamais pensé à utiliser ngOnDestroy (). Il est nécessaire pour les fuites de mémoire je pense. Je comprends parfaitement la deuxième approche, je l'ai mise en œuvre et ça marche!

3
votes

Si vous ne voulez pas vous abonner, vous pouvez obtenir la valeur observable en utilisant async et await , mais pour ce faire, vous devez convertir le Observable dans une `Promise.

Quelque chose comme ceci:

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  public loggedin: boolean;
  public otherValue: boolean;

  constructor(private auth: AuthenticationService) { }

  async ngOnInit() {
    this.loggedin = await this.auth.$isLoggedinSource.toPromise();
    this.otherValue = await this.auth.$otherObservable.toPromise();
  }
}

Vous pouvez le voir fonctionner dans ce lien stackblitz.

0 commentaires