Angular SSE handling

CountryStreamService.ts

import { Injectable, NgZone } from '@angular/core';
import { Observable } from 'rxjs';
import { Country } from './country.model';

@Injectable({ providedIn: 'root' })
export class CountryStreamService {

  private readonly url = 'https://localhost:5001/countries/stream';

  constructor(private zone: NgZone) {}

  streamCountries(): Observable<Country> {
    return new Observable<Country>(observer => {
      const eventSource = new EventSource(this.url);

      // Listen to events named "country" (set on the server)
      eventSource.addEventListener('country', (event: MessageEvent) => {
        this.zone.run(() => {
          const country = JSON.parse(event.data) as Country;
          observer.next(country);
        });
      });

      eventSource.onerror = error => {
        this.zone.run(() => observer.error(error));
        eventSource.close();
      };

      return () => eventSource.close();
    });
  }
}