Angular 9 - BehaviorSubject 服务于之前的值

Question

我正在尝试为获取数据并将数据分配给组件的通用方法提供解决方案。我正在玩 BehaviorSubject，因为我认为它是该工作的合适人选。这是一些代码：

服务：

public listSubject: BehaviorSubject<any[]>;

constructor(private service: someservice) {
   this.listSubject = new BehaviorSubject<any[]>([]);
}

public requestList(id: number) {
this.someservice.get('url')
.subscribe(data => {
  this.listSubject.next([data]);
});

}

public get list(): any[] {
  if (this.listSubject.value.length > 0) {
    return [this.projectListSubject.value];
  } else {
    return null;
  }
}

实施：

constructor(public service: AwaAlertsService) {
  // need full list first
  this.service.requestProjectList(1);
  this.list = this.service.projectList;
}

this.service.requestList(id);
this.list = this.service.list;

除了我得到的是以前的值外，它工作正常。

知道我做错了什么吗？

谢谢

Answer 1

至少在这个例子中 BehaviorSubject 是多余的，因为你可以简单地将列表分配给属性就像 : Array<any> 并且它会做同样的事情而没有 [=15] 的开销=].

但是如果您将列表变成可观察的，那么 BehaviorSubject 就有意义了，因为现在它会在列表发生更改时通知您并且您可以在您的应用程序中共享它。

constructor(private service: someservice) {
   this.listSubject = new BehaviorSubject<any[] | null>(null);
}

public get list$(): Observable<any[] | null> {
  return this.projectListSubject;
}

及以后在组件代码或模板中

this.doSomething = service.list$.pipe(
  // ....
);

<ng-container *ngIf="service.list$ | async as items">
  <ng-container *ngIf="items">
    <div *ngFor="let item of items"> {{ item }} </div>
  </ng-container>
</ng-container>

Angular 9 - BehaviorSubject 服务于之前的值

Angular 9 - BehaviorSubject serves previous value

rxjs

angular9