Angular英雄指南教程-遇到的坑-服務注入
阿新 • • 發佈:2019-01-25
首先給出Angular的入門示例
英雄指南教程 的連結地址(這個入門級 app 包含很多資料驅動的應用所需的特性。 它需要獲取並顯示英雄的列表、編輯所選英雄的詳情,並且在英雄資料的不同檢視之間導航。)
我的Angular CLI資訊:
Angular CLI: 1.7.4
Node: 8.9.3
OS: win32 x64
Angular:
...
在按照官網說給的示例在建立服務後並沒有下面的這個:providedIn: ‘root’,而且也不能把它寫在@Injectable註解裡面,vscode編輯器會提示@Injectable不接收任何引數。
@Injectable ({
providedIn: 'root',
})
直接執行會報找不到服務提供者 [NullInjectorError: No provider for HeroService!]:
百度了網上各大神的解決方法,找到一個是在所需要該服務的模板中的@Component註解中加入 providers:[] 屬性進行服務注入,如下圖。如果想要在其它服務中呼叫自己的服務,可以在全域性的app.module.ts中的@NgModule標籤加入providers:[] 注入服務。
關於服務中呼叫服務這個問題,參考同事的說法可以有下面2個方法:
方法一:是在一個全域性的app.module.ts中進行註冊(如上文所述);
方法二
@Component({
selector: 'app-messages',
templateUrl: './messages.component.html',
styleUrls: ['./messages.component.css'],
//元件中注入服務(還可以在全域性模組(app.module.ts)中注入服務)
providers:[
MessageService
]
})