[英]Getting error as "NullInjectorError: StaticInjectorError(AppModule)[ContactService -> HttpHeaders]"
I tried all the possible solutions like importing HttpClientModule in app.module.ts and all the suggestions given when I searched for this error message, but nothing solves my issues.我尝试了所有可能的解决方案,例如在 app.module.ts 中导入 HttpClientModule 以及搜索此错误消息时给出的所有建议,但没有解决我的问题。 Did I miss any settings in .ts files.我是否错过了 .ts 文件中的任何设置。
//contact.service.ts
import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { HttpClientModule } from '@angular/common/http';
import { Contact } from './contact';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';
@Injectable({
providedIn: 'root'
})
export class ContactService {
constructor(private http:HttpClient, headers:HttpHeaders) { }
//retrewing contacts
getContacts(){
return this.http.get('http://localhost:3000/api/contacts')
.pipe(map(res => res));
}
// Adding contacts
addContacts(newContact){
var headers = new HttpHeaders();
headers.append('Content-Type','application/json');
return this.http.post('http://localhost:3000/api/add',newContact, {headers:headers})
.pipe(map(res => res));
}
//delete contacts
deleteContacts(id){
return this.http.delete('http://localhost:3000/api/delete'+id)
.pipe(map(res => res));
}
}
My contacts.component.ts我的contacts.component.ts
import { Component, OnInit } from '@angular/core';
import { ContactService } from '../contact.service';
import { Contact } from '../contact';
import { HttpClientModule } from '@angular/common/http';
@Component({
selector: 'app-contacts',
templateUrl: './contacts.component.html',
styleUrls: ['./contacts.component.css'],
providers: [ContactService]
})
export class ContactsComponent implements OnInit {
contacts : any;
contact : Contact;
first_name : string;
last_name : string;
phone_no : string;
constructor(private contactService:ContactService) { }
ngOnInit() {
this.contactService.getContacts()
.subscribe(contacts=>
this.contacts = contacts);
}
}
My app.module.ts我的 app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { ContactsComponent } from './contacts/contacts.component';
import { HttpClientModule } from '@angular/common/http';
import { HttpClient } from '@angular/common/http';
@NgModule({
declarations: [
AppComponent,
ContactsComponent
],
imports: [
BrowserModule,
AppRoutingModule,
HttpClientModule
],
providers: [HttpClientModule],
bootstrap: [AppComponent]
})
export class AppModule { }
I have added httpclientmodule in all of the above, but still am getting an error message, Do I need to add any more settings.我已在上述所有内容中添加了 httpclientmodule,但仍然收到错误消息,我是否需要添加更多设置。
There is no provider for HttpHeaders
.没有HttpHeaders
提供者。 You don't inject instances of HttpHeaders
, you just create instances as you need them, which you are already doing.您不注入HttpHeaders
实例,您只需根据需要创建实例,您已经在这样做了。
You can fix this problem by removing the injected HttpHeaders
from the ContactService
constructor.您可以通过从ContactService
构造函数中删除注入的HttpHeaders
来解决此问题。
export class ContactService {
constructor(private http:HttpClient) { }
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.