Angular 如何从http请求向组件发送布尔值？（角度）

我用Angular 7创建了一个程序，我想用布尔值捕捉http请求并将其传输到组件。为此，我尝试使用Behavior Subject和next。因此，在这两个函数checkin（）和checkOut（）中，布尔值必须为真。我附上了密码。我将感谢任何帮助。谢谢

从'@angular/core'导入{Component，OnInit}；
从“../../../interceptor/http loading.interceptor”导入{HttpLoadingInterceptor}；
从“rxjs”导入{Subscription}；
@组成部分({
选择器：“应用程序”，
templateUrl:“./app.html”，
样式URL:['./app.scss']
})
导出类应用程序实现OnInit{
subscriptionBlockUI：订阅；
blockUIState：布尔值；
建造师(
专用httpLoadingInterceptor:httpLoadingInterceptor
) { }
恩戈尼尼特（）{
this.subscriptionBlockUI=this.httpLoadingInterceptor.blockUIStateValue（）.subscribe（（blockUIValue:boolean）=>{
this.blockUIState=blockUIValue；
});
}
ngOnDestroy（）：void{
this.subscriptionBlockUI.unsubscribe（）；
}
}

从'@angular/core'导入{Injectable}；
从“ng block ui”导入{BlockUIService}；
从'@angular/common/http'导入{HttpInterceptor，HttpRequest，HttpHandler，HttpEvent}；
从“rxjs”导入{observeable，BehaviorSubject}；
从“rxjs/operators”导入{finalize}；
从“@angular/compiler”导入{CompileShallowModuleMetadata}；
export const HEADER_LOADING='loadingEnabled'；
@可注射（）
导出类HttpLoadingInterceptor实现HttpInterceptor{
只读blockUiSelector:string='http请求'；
私有计数=0；
public blockUIState=新行为主体（false）；
构造函数（私有uiServ:BlockUIService）{}
截取（req:HttpRequest，next:HttpHandler）：可观察{
如果（请求标题有（标题加载））{
返回next.handle（req）；
}
这是checkin（）；
返回next.handle（req.pipe）（finalize（（）=>this.checkOut（））；
}
公共签入（）{
如果（this.count==0）{
this.uiServ.start（[this.blockUiSelector]）；
} 
这个.count++；
this.blockUIState.next（true）；
}
公众结账（）{
这是伯爵；
设置超时（（）=>{
如果（this.count==0）{
this.uiServ.stop（[this.blockUiSelector]）；
}
}, 10); 
this.blockUIState.next（true）；
}
public blockUIStateValue（）：可观察{
返回此.blockUIState；
}
}

试试这个： 在component.ts中：

ngOnInit() {
      this.subscriptionBlockUI = this.httpLoadingInterceptor.blockUIState.subscribe((blockUIValue: boolean) => {
      this.blockUIState = blockUIValue;
    });
  }

试试这个： 在component.ts中：

ngOnInit() {
      this.subscriptionBlockUI = this.httpLoadingInterceptor.blockUIState.subscribe((blockUIValue: boolean) => {
      this.blockUIState = blockUIValue;
    });
  }

---

好的，如果你没有得到这个值，你可能想通过行为主体使

blockUIState

成为一个可观察的对象

在职教师

public blockUIState = new BehaviorSubject<boolean>(false);
blockUIState$ = this.blockUIState.asObservable();

编辑：上一次更正无效。 尝试设置调试器

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    if (req.headers.has(HEADER_LOADING)) {
        return next.handle(req);
    }
    debugger;
    this.checkin();
    return next.handle(req).pipe(finalize(() => this.checkOut()));
}

---

因为，当条件为true时，它将返回，并且不会调用'this.checkin（）的下一部分。

好的，如果您没有得到该值，可能是您希望通过BehaviorSubject使

blockUIState

成为可观察的

在职教师

public blockUIState = new BehaviorSubject<boolean>(false);
blockUIState$ = this.blockUIState.asObservable();

编辑：上一次更正无效。 尝试设置调试器

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    if (req.headers.has(HEADER_LOADING)) {
        return next.handle(req);
    }
    debugger;
    this.checkin();
    return next.handle(req).pipe(finalize(() => this.checkOut()));
}

---

---

因为，当条件为true时，它将返回，并且不会调用'this.checkin（）的下一部分。

问题出在哪里？我从您的问题中了解到，您希望以布尔值捕获http请求，该布尔值为

blockUIState

，布尔值必须为true，并在代码中实现。我不明白你面临什么问题，什么错误导致代码失败。我没有收到组件中的2个布尔值，我只收到false。我在调试中验证了。嗯。。。你想达到什么目标？我甚至不明白您为什么要在组件中插入http侦听器，这不是如何使用侦听器。问题是什么？我从您的问题中了解到，您希望在布尔值中捕获http请求，它是

blockUIState

，布尔值必须为true，并且必须在代码中实现。我不明白你面临什么问题，什么错误导致代码失败。我没有收到组件中的2个布尔值，我只收到false。我在调试中验证了。嗯。。。你想达到什么目标？我甚至不明白为什么要在组件中插入http拦截器，这不是如何使用拦截器。我尝试了这个方法，但没有成功。但是谢谢你。我设置了调试器，正如你提到的，它输入了那个函数。我收到的是“blockUIValue未定义”，请检查更新的答案，并让我知道更新的内容。我通过将checkin（）和checkout（）函数放入构造函数解决了这个问题。谢谢是的，太好了。你的问题是签入和签出根本不被调用，对吗？我尝试了这个方法，但它不起作用。但是谢谢你。我设置了调试器，正如你提到的，它输入了那个函数。我收到的是“blockUIValue未定义”，请检查更新的答案，并让我知道更新的内容。我通过将checkin（）和checkout（）函数放入构造函数解决了这个问题。谢谢是的，太好了。你的问题是签入和签出根本不被调用，对吗？