Question

我有点困惑，为什么以下剪辑工作期待。这个服务的想法是有一个字符串列表，如果你添加一个字符串，它会在5秒后被删除。这里使用Rxjs：

@Injectable()
export class ErrorService {

  private errors: Array<string> = [];
  private emitErrorsChanged = new Subject<any>();
  public emitErrorsChanged$ = this.emitErrorsChanged.asObservable();

  constructor() {
    this.emitErrorsChanged$.delay(5000).subscribe(
      () => {
        if (this.errors.length > 0) {
          this.errors.shift();
        }
      }
    );
  }

  public emitErrorChange(error: string) {
    this.errors.push(`${error}`);
    this.emitErrorsChanged.next(this.errors);
  }
}

错误组件订阅此服务errorService.emitErrorsChanged$.subscribe(...)并在列表中显示字符串。其他组件/服务按this.errorService.emitErrorChange(error.message)添加字符串。

我的问题是：为什么删除的错误（5s）会发送到错误组件？错误只是从列表this.errors.shift();中删除，但this.emitErrorsChanged.next(this.errors);
不会发出更改

Answer 1

出现这种情况是因为您正在传递对象的引用（在本例中为list）。 this.errors.shift();所做的更改不会被发出，但我想您可以通过Angular的更改检测来查看this.errors的当前状态。我已准备好demo (click)，因此您可以看到在您的情况下传递了对象引用 - 这意味着订阅中的列表是完全相同的array列表。为了防止它，您可以传递列表的副本，例如使用this example中的扩展运算符：

this.emitErrorsChanged.next([...this.errors]);

为什么使用Rxjs发出此更改

1 个答案: