angular - 在 angular2 中找不到名称错误

Question

我有一个名为 customComponent 的组件

import {Component} from '@angular/core';
import { appService } from './app.service'; 
@Component({
  selector: 'custom-root',
  template: `<h1>how</h1>
    <ul *ngFor="let hero of heroes"><li>{{hero}}</li></ul>`,
})
export class CustomComponent {
    heroes = ['first','second','third'];
   //heroes;

   value: string = ""; 
 // constructor(appService: appService) { }  

   /* ngOnInit(): void { 
      this.value = this._appService.getApp(); 
   } */

}

在 appService我有

import { 
   Injectable 
} from '@angular/core';  

@Injectable()
export class appService {  
   getApp(): string { 
      return "Hello world"; 
   } 
} 

在 app.module.ts我正在导入应用服务

import { appService } from './app.service'; 


@NgModule({
  declarations: [
    AppComponent,CustomComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    RouterModule
   // appService
  ],  
  providers: [appService],
  bootstrap: [AppComponent]
})
export class AppModule { }

现在我收到一个错误

cannot find name appService in custom Component line number 15

我该如何解决这个问题？

Answer 1

在 CustomComponent 文件导入中:

import { Inject } from '@angular/core';  

然后在 DI 的构造函数中使用它:

constructor(@Inject(appService) private appService) { }

在此之后，请确保您在模块的提供者中取消注释 appService。

imports: [
  BrowserModule,
  FormsModule,
  HttpModule,
  RouterModule,
  appService
],