ng-bootstrapにツールチップが表示されない

Question

ツールチップを表示したい。私はng-bootstrapに行き、そのコードを統合しました。コンソールエラーを取得しています。

core.es5.js:1020 ERROR Error: Uncaught (in promise): Error: No provider for 
NgbTooltipConfig! 
Error: No provider for NgbTooltipConfig! 
at injectionError (core.es5.js:1169) 
at noProviderError (core.es5.js:1207) 
at ReflectiveInjector_._throwOrNull (core.es5.js:2649) 
at ReflectiveInjector_._getByKeyDefault (core.es5.js:2688) 
at ReflectiveInjector_._getByKey (core.es5.js:2620) 
at ReflectiveInjector_.get (core.es5.js:2489) 
at resolveNgModuleDep (core.es5.js:9492) 
at NgModuleRef_.get (core.es5.js:10562) 
at resolveDep (core.es5.js:11050) 
at createClass (core.es5.js:10920) 

はapp.module.ts NG-bootstrapコマンド

npm install --save @ng-bootstrap/ng-bootstrap 

Answer 1

を使用してあなたがNgbModule.forRoot()ないNgbModuleをインポートする必要がありますがインストールさ

import {NgbModule} from '@ng-bootstrap/ng-bootstrap'; 

@NgModule({ 
    imports: [  
    NgbModule 
    ] 
}) 

にこれらの行を追加しました。

正確な方法を使用すると、のようなコードで終わるべきでのルート（最上位） モジュールのためのわずかに異なるであろう（ NgbModule.forRoot()注意）：

import {NgbModule} from '@ng-bootstrap/ng-bootstrap'; 

@NgModule({ 
    declarations: [AppComponent, ...], 
    imports: [NgbModule.forRoot(), ...], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { 
} 

他のモジュールで単にインポートすることができ、アプリケーションNgbModule：

詳細については

import {NgbModule} from '@ng-bootstrap/ng-bootstrap'; 

@NgModule({ 
    declarations: [OtherComponent, ...], 
    imports: [NgbModule, ...] 
}) 
export class OtherModule { 
} 

、嘆願SE読み：

https://ng-bootstrap.github.io/#/getting-started

---

ここでツールチップの実施例である：

http://plnkr.co/edit/AVylfgSqv5iLVi73LGz7?p=preview

それをあなたのコードを比較してください。