HttpInterceptorのComponentの関数を呼び出しますか？

Question

コンポーネントの関数をHttpInterceptorから呼び出すことはできますか？

@Injectable() 
export class HttpResponseInterceptor implements HttpInterceptor { 

    // constructor(@Inject(DOCUMENT) private document: any) { } 

    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> { 
    console.log('HttpRequest<any> called'); 
    const started = Date.now(); 
    // Call component function 
    return next.handle(req).do((event: HttpEvent<any>) => { 
     if (event instanceof HttpResponse) { 
     // Call component function on response 
     } 
    }); 
    } 

} 

Answer 1

コンポーネントの機能をサービスから呼び出すことはできません。これはAngularの仕組みではありません。これを行うには、基本的にそのコンポーネントのクラスインスタンスをサービスに渡す必要があり、アクセス可能なプロパティが公開されている必要があります。しかし、それは汚いアプローチであり、あなたはそれを避けるべきです。

ただし、サービスから観測可能なストリームに追加することはできます。コンポーネントは、その観測可能なストリームを購読し、必要な機能を呼び出すことができます。これは、これを行う「角度のある方法」になります。

この手法を使用すると、必要な数のコンポーネントで同じデータを取得することができ、それらのコンポーネントで必要なだけ多くの関数を呼び出すことができます。あなたがする必要があるのはsubscribe()と呼吸だけです。例えば

：

@Injectable() 
export class HttpResponseInterceptor { 
    dataStream: ReplaySubject<any> = new ReplaySubject(); 

    dataStream$(): Observable<any> { 
     return this.dataStream().asObservable(); 
    } 

    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> { 
     console.log('HttpRequest<any> called'); 
     const started = Date.now(); 

     return next.handle(req).do((event: HttpEvent<any>) => { 
      if (event instanceof HttpResponse) { 
       // Pass in some data in the `next()` function. 
       // Every time this is called, your components subscription function will be triggered. 
       this.dataStream.next(...); 
      } 
     }); 
    } 
} 

@Component({...}) 
export class MyComponent { 
    ngOnInit() { 
     this.httpInterceptorService.dataStream$().subscribe(data => { 
      // This will be triggered every time data is added to the stream in your HttpInterceptorService class. 
      // Call your custom function here... 
     }); 
    } 
}