29、在 Angular 客户端中使用 WebSockets

在 Angular 客户端中使用 WebSockets

1. 封装可观察流到服务中

首先，我们可以创建一个可观察服务，该服务无需连接任何服务器就能发出硬编码的值。以下是创建一个每秒发出当前时间的服务的代码：

import {Observable} from 'rxjs';
export class ObservableService {
  createObservableService(): Observable<Date> {
    return new Observable(
      observer => {
        setInterval(() =>
          observer.next(new Date())
        , 1000);
      }
    );
  }
}

在这个服务中，我们创建了一个 Observable 对象的实例。假设订阅者会提供一个知道如何处理发出数据的 Observer 。每当可观察对象调用 observer.next(new Date()) 方法时，订阅者将收到当前的日期和时间。这个数据流不会抛出错误，也不会完成。

接下来，我们将 ObservableService 注入到 AppComponent 中，该组件调用 createObservableService() 方法并订阅其值流，创建一个知道如