web-dev-qa-db-ja.com

ngx-bootstrapをmy angular 4プロジェクトにインストールする方法

angular 4プロジェクトにngx-bootstrapをインストールできないため、事前定義されたテンプレートを使用できない場合があります。ngx-bootstrapをインストールするための2つのリンクの下を通過したので、ガイドしてくださいそれを行う正しい方法。

https://valor-software.com/ngx-bootstrap/#/getting-started

https://loiane.com/2017/08/how-to-add-bootstrap-to-an-angular-cli-project/

5
Braj Ankit

ngx-bootstrapにはすべてのコアが含まれます(だけでなく)Bootstrap Angularによって供給されるコンポーネントです。したがって、元のJSコンポーネントを含める必要はありませんが、Bootstrapによって提供されるマークアップとcssを使用しています。

インストール手順

Githubの公式 Getting Started ページを確認してください。

コントロールとドキュメントは ここで入手可能 です。

npmからngx-bootstrapをインストールします:

npm install ngx-bootstrap --save

必要なパッケージをNgModuleインポートに追加します。

import { TooltipModule } from 'ngx-bootstrap/tooltip';

@NgModule({
  ...
  imports: [TooltipModule.forRoot(),...]
  ...
})

コンポーネントをページに追加します:

<button type="button" class="btn btn-primary"
        tooltip="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
  Simple demo
</button>

bootstrapスタイルが必要です:

Bootstrap 3

<!-- index.html -->
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

Bootstrap 4

<!--- index.html -->
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet">
5
RajeshKdev

これを使って:

npm install ngx-bootstrap --save

そしてそれはそこに与えられています:

enter image description here

2
Prachi