Como Usar O Behavior Subject No Angular

O Angular, ao contrário do React, por exemplo, não possui um padrão definido de gerenciamento de estado.
O Rxjs possui observers (que são a nossa interface para consumir dados) e observables (nossa interface para submeter dados).
Então, hoje vamos ver como podemos utilizar o BehaviorSubject, um Subject que permite emitir o valor atual!

A primeira coisa que devemos fazer então é criar o nosso Service:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
import { Injectable } from '@angular/core';
import { BehaviorSubject } from 'rxjs/BehaviorSubject';

interface IUser {
name: string;
lastName: string;
age: number;
}

@Injectable()
export class UserService {

private userData = new BehaviorSubject<IUser>(undefined);

constructor() { }

setUser(user: IUser): void {
this.userData.next(user);
}

getUser(): Observable<IUser> {
return this.userData.asObservable();
}
}

Dessa forma agora temos o nosso getter/setter de usuário, em um ponto centralizado!
Agora como podemos utilizar esse serviço?

Chamamos o service para isso:

1
2
3
4
5
6
7
8
9
10
11
//injetamos o service
...

UserService.getUser.subscribe(user => {
// Recebemos as informações
// do usuário dentro do subscribe
})
...
// Atualizamos as informações
// do usuário
UserService.setUser(newUser);

Bem tranquilo de usar, não é mesmo?