Angular *ngFor Behavior Subject |异步不更新

我对BehaviorSubject和异步管道有问题。它不会在后面显示Behavior Subject的所有项目。下一步。它只显示“prova”项。我在拦截器中记录了错误$，我还有其他项目。为什么它不显示页面中的所有项目？谢谢

模板

错误拦截器

---

对，因为这个值就是你传递给的。下一步。 如果要收集所有错误，需要将代码更改为

errors$.next[…errors$.value，newError]； 一种可能的解决方案是创建一个令牌并共享该主题

供应商：[ { 提供：“错误”， useValue:new BehaviorSubject['prova']， }, ], 然后在您的组件代码中，而不是在ErrorInterceptor的注入中注入@inject'errors'public readonly errors$：Observable

并更新拦截器以执行相同的操作

constructor@Inject“errors”受保护的只读错误$：BehaviorSubject{} // .... 此.errors$.nexterrors； 之后，在模板中，您可以使用

<div class="alerts">
    <div class="alert" *ngFor="let error of (errors$ | async) ">
        {{error}}
    </div>
</div>

---

在上面的代码中，我看到错误在errors中，而不是errors$。要将它们放入errors$，需要调用errors$.nexterrors；。例如，在此之前.errors.nexterrors$；然后请更新描述中的代码示例，因为目前它比较混乱。谢谢，您如何为模板提供errorInterceptor？我将它注入组件的构造函数中。它起作用了，我在Behavior Subject声明中看到了我传递的项我已经更新了答案。解决方案是将错误主题移动为独立的依赖项。

@Injectable({ providedIn: 'root' })

export class ErrorInterceptor implements HttpInterceptor {

errors$ = new BehaviorSubject<string[]>(['prova']);

    constructor() {} 

    intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {

        return next.handle(request).pipe(catchError(err => {
            if (err.status >= 400 && err.status < 500) {

                console.error('error-interceptor:error status=' + err.status + ' message=' + err.message + ' msg='+err.msg);
                const errors = [...this.errors$.value];
                errors.push(err.status);
                this.errors$.next(errors);
                console.table(this.errors$.value);

            } else {

                console.error('error-interceptor:err=' + err.error + ' statusText=' + err.statusText + ' status:' + err.status);

            }

            const error = err.error.msg || err.statusText;
            return throwError(error);

        }));

    }

}

<div class="alerts">
    <div class="alert" *ngFor="let error of (errors$ | async) ">
        {{error}}
    </div>
</div>