2017-09-19 2 views
3

J'ai créé un service Angular qui définit un objet avec des informations utilisateur. Lorsque je change d'utilisateur, le service émet un observable, capturé par certains composants frères pour mettre à jour les informations. Le problème est que la première fois que je définis les données, il n'y a encore personne souscrit, donc je reçois une valeur indéfinie. J'ai lu sur la conversion de l'observable à «chaud» en utilisant publish() ou share() mais je suis assez nouveau à RxJS et je n'ai toujours pas compris comment cela fonctionne à 100%, donc je suis un peu perdu.Comment obtenir la dernière émission Observable

Le code de service (la partie pertinente):

getFwcUser() : Observable<FwcUser> { 
    return this.subjectFwcUser.asObservable(); 
} 

setFwcUser(user : FwcUser) { 
    this.fwcUser = user; 

    this.subjectFwcUser.next(this.fwcUser); 
} 

REMARQUE: FwcUser est une interface avec certains champs utilisateur. J'exécute setFwcUser dans un gestionnaire de boutons pour choisir l'utilisateur.

L'abonné tardif (code du composant):

ngOnInit() { 
    this.fwcUserService.getFwcUser() 
    .subscribe(
     (user : FwcUser) => { console.log('Received: ', user); this.fwcUser = user; } 
); 
    [......] 
} 

Toujours impressions: «Reçu: non défini. REMARQUE: Le composant se trouve dans un '* ngIf = "fwcUser"', donc il est chargé lorsque j'appelle 'setFwcUser' d'un composant frère. Comment puis-je obtenir ce composant pour lire la valeur perdue?

En outre, quelqu'un pourrait vous recommander une bonne ressource pour en savoir plus sur RxJS pour les débutants? Je suis en train de lire quelques livres sur Angular4 mais aucun d'entre eux ne l'explique clairement ...

Merci!

Répondre

3

BehaviorSubject est la réponse ici. Plutôt qu'un objet standard (Observable) qui émet juste des valeurs au fur et à mesure, BehaviorSubject émet la dernière valeur sur subscribe(). Vous pouvez également obtenir la dernière valeur manuellement à l'aide de la méthode BehaviorSubjects getValue().

Une remarque à faire à propos du code ci-dessous est que le bloc null dans la déclaration BehaviorSubject représente la valeur initiale du BehaviorSubject lors de l'initialisation. Vous pouvez le laisser ou le pré-remplir avec une valeur.

service

ÉDITÉ: Correction d'un couple d'erreurs de frappe.

fwcUser: BehaviorSubject<FwcUser> = new BehaviorSubject<FwcUser>(null); 
fwcUser$ = this.fwcUser.asObservable(); 

// Set the value of the fwcUser 
updateFwcUser(user) { 
    this.fwcUser.next(user); 
} 

Component

// Subscribe to the BehaviorSubject 
ngOnInit() { 
    this.fwcUserService.fwcUser$.subscribe(_fwcUser => { 
     this.fwcUser = _fwcUser 
    } 
} 

// Get the current (previously emitted) value manually 
getFwcUser() { 
    this.fwcUser = this.fwcUserService.fwcUser.getValue(); 
} 
+0

Merci pour votre réponse rapide! Et à quoi ressemblerait la fonction setFwcUser()? Est-ce que ça devrait être quelque chose comme ça? 'this.fwcUser = new BehaviorSubject (utilisateur);' – Fel

+0

J'ai mis à jour ma réponse avec la meilleure façon de mettre à jour un BehaviorSubject. Vous voudrez ajouter une fonction dans le service qui accepte la nouvelle valeur que vous voulez émettre et ensuite utiliser la fonction 'next()' pour sortir la nouvelle valeur. – joshrathke

+0

Salut à nouveau! Désolé je ne pouvais pas le tester avant, j'ai été très occupé ... J'ai suivi vos instructions et ça fonctionne parfaitement! Merci beaucoup :) – Fel