如何使用拦截器显示图形组件

Question

我正在使用 Angular 6 开发一个 Web 应用程序。 我创建了一个拦截器服务（使用接口HttpInterceptor）来拦截某些类型的HTTP 调用。 该类完美运行（我可以拦截所有我想要的 HTTP 调用）。 在这个应用程序中有几个图形组件。使用拦截器中编写的代码显示图形组件（例如微调器或模式窗口）的方式是什么？

一个例子：

@Injectable()
export class MyHttpInterceptor implements HttpInterceptor {

    intercept(req: HttpRequest<any>, next: HttpHandler ) {

        let updateReq;

        updateReq = req.clone({
            setParams: {
                responseType: 'no-type'
            }
        }
        );

        console.log(updateReq);

        return next.handle(updateReq).pipe(tap(
            event => console.log(event),
            err => console.log(err)
        ));
    }

}

例如我想测试req是否有一些属性， 然后我让一个图形组件出现。如何在整个申请过程中执行此操作？

Answer 1

1. 使用显示/隐藏微调器的标志创建微调器组件
2. 创建一个新服务“spinnerservice”，它会切换一个标志并在微调器被切换时发出一个事件。
3. 在您的微调器组件和拦截器中注入您的服务
4. 从拦截器调用“spinnerservice”
5. 在您的 spinnercomponent 中侦听来自您服务的事件并调整您的 spinner 状态。