无法找到 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 { }

现在我收到一个错误

在自定义组件行号 15 中找不到名称 appService

我该如何解决这个问题？

Answer 1

在 CustomComponent 文件导入中：

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

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

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

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

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

Answer 2

替换此代码块

export class CustomComponent {
    heroes = ['first','second','third'];
   //heroes;

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

   ngOnInit(): void { 
      this.value = this.appService.getApp(); 
   }

}

问题 ：

您正在调用 this._appService.getApp();

1. 您尚未定义 _appService。

2. 还没有为 appService 进行 DI。