ИСКЛЮЧЕНИЕ: Нет Директива аннотаций находится на ArticlesService

Question

This is a Planker

я Тринг, чтобы получить весь текст статьи из JSon файла, нажмите на кнопку «больше». Когда я нажимаю кнопку «больше», я получаю сообщение об ошибке «ИСКЛЮЧЕНИЕ: никаких аннотаций по директиве, найденных в ArticlesService».

article.ts

import {Component} from 'angular2/core'; 
import {HTTP_PROVIDERS} from 'angular2/http'; 
import {MATERIAL_DIRECTIVES} from 'ng2-material/all'; 
import { Router } from 'angular2/router'; 
import {ArticlesService} from './article-service'; 
import {ArticlesDetailComponent} from './article-detail'; 

@Component({ 
selector: 'articles', 
providers: [ArticlesService,HTTP_PROVIDERS], 
template: ` 
<md-content class="md-padding" layout="row" layout-wrap layout-align="center start"> 

<img src="{{article.article_img}}" class="md-card-image" alt="Grass"> 
    <md-card-title> 
    <md-card-title-text> 
     <span class="md-headline">{{article.article_title}}</span> 
    </md-card-title-text> 
    </md-card-title> 
    <md-card-content> 
    {{article.article_content}} 
    </md-card-content> 
    <md-card-actions layout="row" layout-align="end center"> 
    <button md-button (click)="gotoDetail()">More</button> 
    </md-card-actions> 
</md-card> 
</div> 
</md-content>`, 
directives: [MATERIAL_DIRECTIVES,ArticlesDetailComponent] 
}) 
    export class ArticlesComponent { 

    constructor(private _articles:ArticlesService,private _router:Router) {} 

public articles; 
private errorMessage; 
ngOnInit() { this.getArticles();} 

    getArticles() { 
    this._articles.getArticles() 
    .subscribe(articles => 
    this.articles = articles, 
    error => this.errorMessage = <any>error); 
    } 
gotoDetail() { 
    this._router.navigate(['ArticlesDetail', { id: this.articles.id }]); 
} 
} 

и статьи-detail.ts

import {Component,OnInit} from 'angular2/core'; 
import {HTTP_PROVIDERS} from 'angular2/http'; 
import {MATERIAL_DIRECTIVES} from 'ng2-material/all'; 
import {ArticlesService} from './article-service'; 
import { RouteParams } from 'angular2/router'; 


    @Component({ 
    selector: 'articles-detail', 
    providers: [ArticlesService,HTTP_PROVIDERS], 
    template: ` 
    <p>Detail</p> 
       `, 
    directives: [MATERIAL_DIRECTIVES,ArticlesService] 
     }) 
    export class ArticlesDetailComponent implements OnInit { 

    constructor(private _articles:ArticlesService,private _routeParams:    RouteParams) {} 

public article; 

    ngOnInit() {this.getArticle();} 


    getArticle() { 
let id = +this._routeParams.get('id'); 
    console.log(id); 
    this._articles.getArticle(id) 
    .then(article => this.article = article); 
    } 

goBack() { 
window.history.back(); 
    } 
} 

Answer 1

Вы можете установить службу в атрибуте ArticlesDetailComponent компонента directives:

@Component({ 
    selector: 'articles-detail', 
    providers: [ArticlesService,HTTP_PROVIDERS], 
    template: ` 
    <p>Detail</p> 
    `, 
    directives: [MATERIAL_DIRECTIVES,ArticlesService] // <----------- 
}) 
export class ArticlesDetailComponent { 
    (...) 
} 

но это не компонент. Вот почему у вас есть сообщение об ошибке ...