在 angular 7 中将一个组件导入另一个组件时出错
Error while importing a component to another component in angular 7
每次我尝试将一个组件导入另一个组件(它们不是同级组件)时,我都会在控制台上收到此错误:
...
ERROR Error: "StaticInjectorError(AppModule)[LogsTableComponent -> FilterBarComponent]:
StaticInjectorError(Platform: core)[LogsTableComponent -> FilterBarComponent]:
NullInjectorError: No provider for FilterBarComponent!"
...
这是我的 app.module.ts 文件:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { HttpClientModule } from '@angular/common/http';
import { AppComponent } from './app.component';
import { LogsTableComponent } from './components/logs-table/logs-
table.component';
import { FilterBarComponent } from './components/filter-bar/filter-
bar.component';
import { BsDatepickerModule } from 'ngx-bootstrap/datepicker';
import { HttpClientTestService } from './http-client-test.service';
@NgModule({
declarations: [
AppComponent,
FilterBarComponent,
LogsTableComponent,
],
imports: [
BrowserModule,
// HttpClientModule should be imported after BrowserModule.
HttpClientModule,
BsDatepickerModule.forRoot()
],
providers: [HttpClientTestService],
bootstrap: [AppComponent]
})
export class AppModule { }
任何人都可以帮助我知道为什么会出现此错误以及如何解决它。
这可能是关键词:"No provider for FilterBarComponent!"。
我想,您应该将 FilterBarComponent 添加到 "AppModule" 文件中的 "imports/providers (?)" 数组。
您需要 import
app.module.ts
文件中的 FilterBarComponent 并在 app.module.ts
的 declaration
部分添加 FilterBarComponent 才能使用该组件。
每次我尝试将一个组件导入另一个组件(它们不是同级组件)时,我都会在控制台上收到此错误:
...
ERROR Error: "StaticInjectorError(AppModule)[LogsTableComponent -> FilterBarComponent]:
StaticInjectorError(Platform: core)[LogsTableComponent -> FilterBarComponent]:
NullInjectorError: No provider for FilterBarComponent!"
...
这是我的 app.module.ts 文件:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { HttpClientModule } from '@angular/common/http';
import { AppComponent } from './app.component';
import { LogsTableComponent } from './components/logs-table/logs-
table.component';
import { FilterBarComponent } from './components/filter-bar/filter-
bar.component';
import { BsDatepickerModule } from 'ngx-bootstrap/datepicker';
import { HttpClientTestService } from './http-client-test.service';
@NgModule({
declarations: [
AppComponent,
FilterBarComponent,
LogsTableComponent,
],
imports: [
BrowserModule,
// HttpClientModule should be imported after BrowserModule.
HttpClientModule,
BsDatepickerModule.forRoot()
],
providers: [HttpClientTestService],
bootstrap: [AppComponent]
})
export class AppModule { }
任何人都可以帮助我知道为什么会出现此错误以及如何解决它。
这可能是关键词:"No provider for FilterBarComponent!"。 我想,您应该将 FilterBarComponent 添加到 "AppModule" 文件中的 "imports/providers (?)" 数组。
您需要 import
app.module.ts
文件中的 FilterBarComponent 并在 app.module.ts
的 declaration
部分添加 FilterBarComponent 才能使用该组件。