我已经实现了 Http 拦截器,并在服务启动时显示微调器,并在服务成功/失败时隐藏微调器。
代码示例:
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
return next.handle(req).pipe(
tap((event: HttpEvent<any>) => {
if (event instanceof HttpResponse && event.body.errCode != undefined) {
// show_spinner
}
}),
finalize(()=>{
// hide_spinner
})
}
Run Code Online (Sandbox Code Playgroud)
例如,有两个服务调用同时发生;因此,将显示与两个调用相对应的微调器,但第一个服务在2 秒内完成,第二个服务在5 秒内完成;现在,旋转器将在第一个调用完成后隐藏,将无法确认第二个服务调用。
httprequest interceptor rxjs angular-http-interceptors angular
我正在构建一个有角度的应用程序。我通过单击事件从第一个组件导航到第二个组件。在导航到第二个组件时,我愿意将一些数据从第一个组件传递到第二个组件。我已按照教程来实现此目的,但无法做到。下面是我的代码
第一个组件.ts
export class FirstComponent implements OnInit {
@Output() messageEvent = new EventEmitter<string>();
constructor(){
}
ngOnInit() {}
sendMessagetoSecond(ahu) {
this.messageEvent.emit(ahu)
console.log(ahu)
}
Run Code Online (Sandbox Code Playgroud)
第一个组件.html
<map name="ahuMap">
<area shape="rect" coords="818,232,917,262" (click)="sendMessagetoSecond()" [routerLink]="['/secondComponent']">
</map>
Run Code Online (Sandbox Code Playgroud)
第二个组件.ts
ahu : string
receiveMessage($event) {
this.ahu = $event
}
Run Code Online (Sandbox Code Playgroud)
第二个组件 .html
<body>
<app-first (messageEvent)="receiveMessage($event)"></app-first>
ahu: {{ahu}}
<div>
....
</div>
</body>
Run Code Online (Sandbox Code Playgroud)
这就是我尝试过的。我面临的问题是:
1-变量没有被传输到第二个组件
2-第一个组件的 HTML 也被加载到第二个组件中。
我是否遗漏或做错了什么?