Angular 2提供程序無法在組件中訪問

我是angular 2的新手。我正在關注傳統快速啓動應用程序Tour of Heroes。Angular 2提供程序無法在組件中訪問

我創建了應用程序中提到的服務。

我有一個服務HeroService。這是用來拉所有英雄的數據。

我已將HeroService作爲提供程序包含在app.module文件中，以便能夠通過應用程序訪問所有應用程序。

我app.module.ts

import { NgModule }  from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { FormsModule } from '@angular/forms'; 
import { RouterModule } from '@angular/router'; 

import { AppComponent } from './app.component'; 
import { HeroDetailComponent } from './hero-detail.component'; 
import { HeroesComponent } from './heroes.component'; 
import { HeroService } from './hero.service'; 

@NgModule({ 
    imports: [ 
    BrowserModule, 
    FormsModule, 
    RouterModule.forRoot([ 
     { 
     path: 'heroes', 
     component: HeroesComponent 
     } 
    ]) 
    ], 
    declarations: [ AppComponent, HeroesComponent, HeroDetailComponent ], 
    providers: [ HeroService ], 
    bootstrap: [ AppComponent ] 
}) 
export class AppModule { }

而我的組件文件，我想訪問HeroService得到的數據是：

export class HeroesComponent implements OnInit { 
    constructor(private heroService: HeroService) { } 
}

的問題是我得到這樣的錯誤，當我建立項目時：

找不到名字'HeroService'。

我已正確執行了所有步驟。如果我在我的HeroesComponent中導入HeroService，它似乎工作。但沒有導入時失敗。我錯過了一些步驟。據我瞭解，聲明在app.module上的提供者將註冊它在整個應用程序/組件中使用，而不需要每次都導入它。

請糾正我如果我在某個地方錯了。

來源

2017-06-20 Prabodh M

有你在你的組件文件導入'HeroService'？ – Abrar

是否從'hero.service.ts'文件中導出了'HeroService'類？ –

不，我沒有那是我的查詢，如果我需要再次導入它，因爲我已經將它作爲提供程序添加到app.module中。以爲我們可以做到而不需要導入它。現在我沒有看到將它作爲app.module中的提供者添加的一點，因爲我們必須每次導入它。 –

您需要的組件內部導入以及

import { HeroService } from './hero.service';

來源

2017-06-20 11:58:29 Sajeetharan

所以我們需要導入它，即使我們已經添加到app.module提供程序中了嗎？ –

是的，因爲你是在構造函數 – Sajeetharan

中引用它，我認爲沒有必要，因爲我們已經在app.module中將它定義爲provider。感謝您的及時答覆。我早些時候導入，但是如果我們可以避免導入，我們感到困惑。現在我沒有看到將它作爲提供程序包含在app.module中的一點，因爲我們必須每次都要導入它。只要我們可以避免Component Decorator中的提供者密鑰。或者我無法看到它的背景。 –

Angular 2提供程序無法在組件中訪問

回答

相關問題