如何保持连接列表的RxJS

import { Injectable } from '@angular/core';
import { BehaviorSubject } from 'rxjs';

@Injectable({
  providedIn: 'root'
})
export class ConnectionService {
  private connectionsSubject = new BehaviorSubject<string[]>([]);
  connections$ = this.connectionsSubject.asObservable();

  addConnection(connectionId: string) {
    const currentConnections = this.connectionsSubject.value;
    this.connectionsSubject.next([...currentConnections, connectionId]);
  }

  removeConnection(connectionId: string) {
    const currentConnections = this.connectionsSubject.value;
    const updatedConnections = currentConnections.filter(id => id !== connectionId);
    this.connectionsSubject.next(updatedConnections);
  }
}

import { Component, OnInit, OnDestroy } from '@angular/core';
import { Subscription } from 'rxjs';
import { ConnectionService } from './connection.service';

@Component({
  selector: 'app-connection-list',
  template: `
    <ul>
      <li *ngFor="let connection of connections">{{ connection }}</li>
    </ul>
  `
})
export class ConnectionListComponent implements OnInit, OnDestroy {
  connections: string[] = [];
  private subscription: Subscription;

  constructor(private connectionService: ConnectionService) {}

  ngOnInit() {
    this.subscription = this.connectionService.connections$.subscribe(connections => {
      this.connections = connections;
    });
  }

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

import { Component, OnInit, OnDestroy } from '@angular/core';
import { Subscription, Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { ConnectionService } from './connection.service';

@Component({
  selector: 'app-connection-list',
  template: `...`
})
export class ConnectionListComponent implements OnInit, OnDestroy {
  connections: string[] = [];
  private unsubscribe$ = new Subject<void>();

  constructor(private connectionService: ConnectionService) {}

  ngOnInit() {
    this.connectionService.connections$
      .pipe(takeUntil(this.unsubscribe$))
      .subscribe(connections => {
        this.connections = connections;
      });
  }

  ngOnDestroy() {
    this.unsubscribe$.next();
    this.unsubscribe$.complete();
  }
}