在模块 class 中编译 angular 项目时出错
Error while compiling angular project in module class
我的app.module.tsclass是:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpClientModule, HTTP_INTERCEPTORS} from '@angular/common/http';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { WelcomeComponent } from './welcome/welcome.component';
import { LoginComponent } from './login/login.component';
import { EroorComponent } from './eroor/eroor.component';
import { ListTodosComponent } from './list-todos/list-todos.component';
import { MenuComponent } from './menu/menu.component';
import { FooterComponent } from './footer/footer.component';
import { LogoutComponent } from './logout/logout.component';
import { TodoComponent } from './todo/todo.component';
import { HttpIntercepterBasicAuthService } from './service/http/http-intercepter-basic-auth.service';
@NgModule({
declarations: [
AppComponent,
WelcomeComponent,
LoginComponent,
EroorComponent,
ListTodosComponent,
MenuComponent,
FooterComponent,
LogoutComponent,
TodoComponent
],
imports: [
BrowserModule,
AppRoutingModule,
FormsModule,
HttpClientModule
],
providers: [
{provider: HTTP_INTERCEPTORS,
useClass:HttpIntercepterBasicAuthService,
multi:true}
],
bootstrap: [AppComponent]
})
export class AppModule { }
我的 HttpIntercepterBasicAuthService class 正在实现 HttpInterceptor 是:
import { Injectable } from '@angular/core';
import { HttpInterceptor, HttpRequest, HttpHandler, HttpEvent } from '@angular/common/http';
import { Observable } from 'rxjs';
@Injectable({
providedIn: 'root'
})
export class HttpIntercepterBasicAuthService implements HttpInterceptor{
constructor() { }
intercept(request: HttpRequest<any>,next:HttpHandler): Observable<HttpEvent<any>>{
let username='ashwin'
let password='karki'
let basicAuthHeaderString='Basic '+ window.btoa(username+ ':' +password);
request=request.clone({
setHeaders:{
Authorization: basicAuthHeaderString
}
})
return next.handle(request);
}
}
但是当我尝试在 app.module.ts class 中使用提供程序时使用:
providers: [
{provider: HTTP_INTERCEPTORS,
useClass:HttpIntercepterBasicAuthService,
multi:true}
]
我得到的错误是:
我调查了很多 angular 项目,发现当我尝试使用提供程序时 used.But 是相同的过程,但我遇到了错误。
你这里有误,
providers: [{provider: HTTP_INTERCEPTORS
^^^^^^^
应该只是provide
.
您在 provider
中犯了错误,但它是 provide
您可以尝试这些
providers: [
{provide: HTTP_INTERCEPTORS, useClass:HttpIntercepterBasicAuthService,multi:true}
]
我的app.module.tsclass是:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpClientModule, HTTP_INTERCEPTORS} from '@angular/common/http';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { WelcomeComponent } from './welcome/welcome.component';
import { LoginComponent } from './login/login.component';
import { EroorComponent } from './eroor/eroor.component';
import { ListTodosComponent } from './list-todos/list-todos.component';
import { MenuComponent } from './menu/menu.component';
import { FooterComponent } from './footer/footer.component';
import { LogoutComponent } from './logout/logout.component';
import { TodoComponent } from './todo/todo.component';
import { HttpIntercepterBasicAuthService } from './service/http/http-intercepter-basic-auth.service';
@NgModule({
declarations: [
AppComponent,
WelcomeComponent,
LoginComponent,
EroorComponent,
ListTodosComponent,
MenuComponent,
FooterComponent,
LogoutComponent,
TodoComponent
],
imports: [
BrowserModule,
AppRoutingModule,
FormsModule,
HttpClientModule
],
providers: [
{provider: HTTP_INTERCEPTORS,
useClass:HttpIntercepterBasicAuthService,
multi:true}
],
bootstrap: [AppComponent]
})
export class AppModule { }
我的 HttpIntercepterBasicAuthService class 正在实现 HttpInterceptor 是:
import { Injectable } from '@angular/core';
import { HttpInterceptor, HttpRequest, HttpHandler, HttpEvent } from '@angular/common/http';
import { Observable } from 'rxjs';
@Injectable({
providedIn: 'root'
})
export class HttpIntercepterBasicAuthService implements HttpInterceptor{
constructor() { }
intercept(request: HttpRequest<any>,next:HttpHandler): Observable<HttpEvent<any>>{
let username='ashwin'
let password='karki'
let basicAuthHeaderString='Basic '+ window.btoa(username+ ':' +password);
request=request.clone({
setHeaders:{
Authorization: basicAuthHeaderString
}
})
return next.handle(request);
}
}
但是当我尝试在 app.module.ts class 中使用提供程序时使用:
providers: [
{provider: HTTP_INTERCEPTORS,
useClass:HttpIntercepterBasicAuthService,
multi:true}
]
我得到的错误是:
我调查了很多 angular 项目,发现当我尝试使用提供程序时 used.But 是相同的过程,但我遇到了错误。
你这里有误,
providers: [{provider: HTTP_INTERCEPTORS
^^^^^^^
应该只是provide
.
您在 provider
中犯了错误,但它是 provide
您可以尝试这些
providers: [
{provide: HTTP_INTERCEPTORS, useClass:HttpIntercepterBasicAuthService,multi:true}
]