title: Cannot Find name error coming in angular2
body: <p>I have a component called <code>customComponent</code></p>
  
  <pre><code>import {Component} from '@angular/core';
  import { appService } from './app.service'; 
  @Component({
    selector: 'custom-root',
    template: `&lt;h1&gt;how&lt;/h1&gt;
      &lt;ul *ngFor="let hero of heroes"&gt;&lt;li&gt;{{hero}}&lt;/li&gt;&lt;/ul&gt;`,
  })
  export class CustomComponent {
      heroes = ['first','second','third'];
     //heroes;
  
     value: string = ""; 
   // constructor(appService: appService) { }  
  
     /* ngOnInit(): void { 
        this.value = this._appService.getApp(); 
     } */
  
  }
  </code></pre>
  
  <p>In <code>appService</code> i have </p>
  
  <pre><code>import { 
     Injectable 
  } from '@angular/core';  
  
  @Injectable()
  export class appService {  
     getApp(): string { 
        return "Hello world"; 
     } 
  } 
  </code></pre>
  
  <p>In <code>app.module.ts</code> i am importing the app service </p>
  
  <pre><code>import { appService } from './app.service'; 
  
  
  @NgModule({
    declarations: [
      AppComponent,CustomComponent
    ],
    imports: [
      BrowserModule,
      FormsModule,
      HttpModule,
      RouterModule
     // appService
    ],  
    providers: [appService],
    bootstrap: [AppComponent]
  })
  export class AppModule { }
  </code></pre>
  
  <p>Now I am getting an error </p>
  
  <blockquote>
    <p>cannot find name appService in custom Component line number 15</p>
  </blockquote>
  
  <p>How can I solve this?</p>