Нет Directive аннотаций не найдены на HTTPService

Question

Я пишу угловой 2 компонент, чтобы проверить Http услуг и у меня есть это:

Вот мой app.component.ts

import {Component} from 'angular2/core'; 
import {HttpService} from './http.service'; 

@Component({ 
    selector: 'my-app', 
    template: ` 
     <div> 
      <div class="input"> 
       <label for="title">Title</label> 
       <input type="text" id="title" #title> 
       <p></p> 
      </div> 
      <div class="input"> 
       <label for="body">Body</label> 
       <input type="text" id="body" #body> 
       <p></p> 
      </div> 
      <div class="input"> 
       <label for="user-id">User ID</label> 
       <input type="text" id="user-id" #userId> 
       <p></p> 
      </div> 
      <button (click)="onPost(title.value, body.value, userId.value)">Post Data</button> 
      <button (click)="onGetPosts()">Get All Posts</button> 
      <p>Response: {{response | json}}</p> 
     </div> 
    `, 
    directives: [HttpService] 
}) 
export class AppComponent { 
    response: string; 
    constructor(private _httpService: HttpService) {}; 
    onGetPosts() { 
     this._httpService.getPosts() 
      .subscribe(
       response => this.response = response, 
       error => console.log(error) 
      ) 
    } 
} 

Я считаю, моя ошибка в этом файле. Когда я скомпилировал код, который я получил ошибку

Answer 1

Оказывается, я в том числе HTTPService в качестве директивы в моем компоненте декораторе, когда я должен был быть в том числе его в качестве поставщика в поставщиках

 <button (click)="onGetPosts()">Get All Posts</button> 
     <p>Response: {{response | json}}</p> 
    </div> 
`, 
providers: [HttpService] 
}) 
export class AppComponent { 
    response: string; 
    constructor(private _httpService: HttpService) {}; 
    onGetPosts() {