How to model in UML an angular service with serveral Observable attribute

Question

I try to documente my angular code. In a service that I have coded, I have several BehaviorSubject like this :

@Injectable
export class ExampleService {
    private sourceInfoA = new BehaviorSubject<String>(null);
    private sourceInfoB = new BehaviorSubject<String>(null);

    currentInfoA = this.sourceInfoA.asObservable();
    currentInfoB = this.sourceInfob.asObservable();

    constructor() { }

    changeInfoA(info: String){
         this.sourceInfoA.next(info);
    }

    changeInfoB(info: String){
         this.sourceInfoB.next(info);
    }

}

(This service is for instance called on the constructor for an ExampleComponent).

I try to read some documentation (like https://en.wikipedia.org/wiki/Observer_pattern) about the Observer design pattern, but I don't manage to see if i this patterns apply to my sevrice, and overall how can I modelize with this pattern my service.

Can someone help me or give me some indication on how the Observer Pattern can be modelized when we use some rxjs tools like in my case ?

(Sorry for my english, it's not my natural tongue).

Edit : The UML class diagram that I try to do... not sur if it is complying the Observer Patterns :

Answer 1

Your class diagram is roughly correct. If you also want to document the dynamic behavior, then you could add a sequence diagram.

I would change the class diagram as follows:

(1) Add multiplicities to both sides of each association. If ExampleService and ExampleComponent are both singletons:

• Association BehaviorService -- ExampleService: Left multiplicity is 2 and right multiplicity is 0..1.
• Association ExampleService -- ExampleComponent: Both multiplicities are 1.

(2) Add type Observable to the attributes currentInfoA and currentInfoB.

Classes SourceInfoA and SourceInfoB should only be modeled if they really exist as classes in your code.