小编var*_*yal的帖子

使用 Angular HTTP 拦截器管理多个同时异步服务调用的加载器/旋转器

我已经实现了 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

2
推荐指数
1
解决办法
3754
查看次数

如何在彼此不直接链接的角度分量之间共享数据?

我正在构建一个有角度的应用程序。我通过单击事件从第一个组件导航到第二个组件。在导航到第二个组件时,我愿意将一些数据从第一个组件传递到第二个组件。我已按照教程来实现此目的,但无法做到。下面是我的代码

第一个组件.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 也被加载到第二个组件中。
我是否遗漏或做错了什么?

html components angular

1
推荐指数
1
解决办法
2162
查看次数