Angular 10 - 服务器发送的事件 - 缺少事件源

Question

我正在使用 Angular 10 并尝试从 node.js REST 服务器监听服务器发送的事件。我是 Angular 的新手（这是一个学校项目。）无论如何，我发现的所有教程都创建了一个服务，该服务实现了 EventSource 并在接收到块时订阅它们。一切都编译正常，但是当我浏览到使用该服务的页面时，我收到此错误“NullInjectorError：EventSource 没有提供者”。任何人都可以提供可能有帮助的参考或告诉我我需要做什么才能克服错误吗？

明确地说，我不是在创建新的 EventSource class，而是使用我理解的 JavaScript 内置 class (https://developer.mozilla.org/en-US/docs/Web/API/EventSource)。

删除“private _eventSource: EventSource”解决了这个问题，这引发了另一个问题（我想我可能无意中找到了我的答案。）是不是不能声明一个内置变量的情况JavaScript 输入 EventSource?

这是我的代码...

import { Injectable, NgZone } from '@angular/core';
import { HttpClient } from '@angular/common/http'
import { Facility } from '../models/facility.model'
import { Observable } from 'rxjs';

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

  constructor( 
    private _http: HttpClient,
    private _zone: NgZone,
    private _eventSource: EventSource   // removing this resolved the error
  ) { }


  getMyEventSourceStream() {

    return new Observable((observer) => {
      const eventSource = new EventSource(this._summaryUrl);

      eventSource.onopen = (event) => {
        console.log(event);
      }

      eventSource.onmessage = (event) => {
        console.log(event);
        this._zone.run(() => {
          observer.next(event);
        })
      };

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

Answer 1

如果我们能看到一些代码片段但查看错误，那会更容易提供帮助

NullInjectorError: No provider for EventSource

Angular 依赖注入 docs 中缺少一些依赖项，这可能意味着您在代码中的某处创建了服务 class 之类的 export class EventSource { ... } 然后在另一个中你试图在构造函数中提供它

class AnotherClass{
  constructor(private myEventSource: EventSource)
}

但要使其正常工作，您需要让 DI 知道您的新 class docs，这可以通过添加注释来完成

@Injectable({
  providedIn: 'root',
})
export class EventSource {
    ...
}

另一种可能性是你想使用已经可用的 javascript class EventSource docs 然后而不是将它传递给构造函数尝试简单地在构造函数中创建它

class AnotherClass{
  private myEventSource
  constructor(){
    this.myEventSource = new EventSource(..)
  }
}

如果这是问题所在，您稍后可以在 Angular DI 中提供它，这也被提议作为潜在的快速修复。

Angular 10 - 服务器发送的事件 - 缺少事件源

Angular 10 - Server Sent Events - Missing EventSource

angular

provider

eventsource