Question

我有一项向多个侦听组件提供实时数据的服务。该服务只有一个实例，它使用ListenerCollection类在内部存储其侦听器。

@Injectable()
export class SomeService {
  public listeners: ListenerCollection = new ListenerCollection();
}

ListenerCollection内部拥有一组侦听器。它有多种用途，其中之一就是这项特定服务。

export class ListenerCollection {
  private listeners: Set<any> = new Set<any>();

  constructor() {}

  public addListener(listener) {
    this.listeners.add(listener);
  }

  public removeListener(listener) {
    this.listeners.delete(listener);
  }

  public notifyListeners(param: any) {
    const listeners: Iterable<any> = this.listeners.values();
    for (const listener of listeners) {
      listener(param);
    }
  }
}

现在，它的效果很好。但是我不喜欢必须创建一个自定义类来存储和通知侦听器的事实。我的直觉告诉我，为此已经存在一些东西。

所以，这让我想知道，Angular这样做的方式是什么？

Answer 1

这似乎是一个小问题，但实际上范围很广。您需要使用“订阅”作为可观察对象来订阅BehaviourSubject。这是一个非常简单的例子：

@Injectable()
export class SomeService implements OnDestroy {
    private isReady = new BehaviorSubject<boolean>(false); // type: boolean - Default value: false

    public get isReady$() {
        return this.isReady.asObservable(); // returns BehaviourSubject as an Obervable
    }

    ngOnDestroy() {
        this.isReady.complete(); // Good practice to complete subject on lifecycle hook ngOnDestroy
    }
}

您在组件中订阅了更改

export class SomeComponent implements OnInit, OnDestroy {

  constructor(private someStateService: SomeService) {} // Inject service in constructor

  public ngOnInit(): void {
    this.isReadySubscription = this.navigationStateService.getMenuBackgroundColor$().subscribe(data => {
            // change callback
            console.log(data);
        });

  public ngOnDestroy(): void {
   // Remember to unsubscribe your services on destroy - otherwise you might have memory leaks
   if (this.someStateService) {
      this.someStateService.unsubscribe();
   }
  }
}

虽然这不是唯一的方法，但这是服务中的1.01课程。查看文档以获取有关Observables的更多信息。如果要调用API，请查看http client

角度的服务侦听器

1 个答案: