[英]Error: No provider for HttpHandler in angular2
I am trying to implement HttpCache through interceptor.我正在尝试通过拦截器实现 HttpCache。 Following is the caching-interceptor.service.ts
以下是缓存拦截器.service.ts
import { HttpRequest, HttpResponse, HttpInterceptor, HttpHandler, HttpEvent } from '@angular/common/http'
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/do';
import 'rxjs/add/observable/of';
export abstract class HttpCache {
abstract get(req: HttpRequest<any>): HttpResponse<any>|null;
abstract put(req: HttpRequest<any>, resp: HttpResponse<any>): void;
}
@Injectable()
export class CachingInterceptor implements HttpInterceptor {
constructor(private cache: HttpCache) {}
intercept(req: HttpRequest<any>, next: HttpHandler) : Observable<HttpEvent<any>> {
if(req.method !== 'GET'){
return next.handle(req);
}
const cachedResponse = this.cache.get(req);
if(cachedResponse){
return Observable.of(cachedResponse);
}
return next.handle(req).do(event => {
if(event instanceof HttpResponse){
this.cache.put(req, event);
}
})
}
}
and I am calling from test.service.ts我从 test.service.ts 打电话
import { Injectable } from '@angular/core';
import { Headers, Http, Response} from '@angular/http';
import { HttpClient} from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import { ReplaySubject } from 'rxjs/ReplaySubject';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
import { BehaviorSubject } from 'rxjs/BehaviorSubject';
import { APIService } from './api.service';
import { CachingInterceptor } from './caching-interceptor.service';
import { ConfigurationService } from './configuration.service';
import { AuthenticationStatus, IAuthenticationStatus } from '../models';
import { User } from '../models/user.model';
@Injectable()
export class PlatformService extends APIService {
constructor(private http: Http, public httpClient: HttpClient, private configuration: ConfigurationService,
public cachingInterceptor: CachingInterceptor) {
super();
}
getUserById(id: string) {
console.log(this.requestOptions);
return this.httpClient.get(this._getAPIUrl('user/' + id),this.requestOptions).
subscribe(res => res);
}
get requestOptions(): RequestOptions {
const tokenObj = window.localStorage.getItem('TOKEN');
const token = JSON.parse(tokenObj);
const headers = this.headers;
headers.append('Authorization', 'Bearer ' + token.token);
headers.append('Access-Control-Allow-Origin', '*');
return new RequestOptions({ headers: headers });
}
}
and Module file is following和模块文件如下
import { CommonModule } from '@angular/common';
import { HTTP_INTERCEPTORS, HttpClient } from '@angular/common/http';
import { FormsModule } from '@angular/forms';
import { ModuleWithProviders, NgModule } from '@angular/core';
import { PlatformService } from '../../services/platform.service';
import { CachingInterceptor } from '../../services/caching-interceptor.service';
@NgModule({
imports: [CommonModule, FormsModule],
declarations: [],
exports: [],
entryComponents: [EntryHereComponent]
})
export class StructurModule {
public static forRoot(): ModuleWithProviders {
return { ngModule: StructurModule, providers: [PlatformService,
{
provide: HTTP_INTERCEPTORS,
useExisting: CachingInterceptor,
multi: true
},HttpClient] };
}
}
I don't understand, what are missing so it giving error我不明白,缺少什么所以它给出错误
No provider for HttpHandler.
没有 HttpHandler 的提供者。
If I add HttpHandler in provider in module file, It start giving error for provide: HTTP_INTERCEPTORS, component.如果我在模块文件中的 provider 中添加 HttpHandler,它会开始为提供错误:HTTP_INTERCEPTORS,组件。
HttpClient
is introduced in angular 4.3,so if you want to use HttpClient
you need to import HttpClientModule
from '@angular/common/http'
. HttpClient
是在 angular 4.3 中引入的,所以如果你想使用HttpClient
你需要从'@angular/common/http'
导入HttpClientModule
。 Make sure to import HttpClientModule
after BrowserModule
as shown below.确保在
BrowserModule
之后导入HttpClientModule
,如下所示。 This official doc and so answer will give you indepth information.这个官方文档等答案将为您提供深入的信息。
import { HttpClientModule } from '@angular/common/http';
@NgModule({
imports: [
BrowserModule,
HttpClientModule
],
...
Add HttpClientModule to your imports[] in app.module.ts.将 HttpClientModule 添加到 app.module.ts 中的导入[]。 This might be one of the mistakes.
这可能是错误之一。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.