這篇文章給大家分享的是有關angular如何集成bootstrap4的內容。小編覺得挺實用的，因此分享給大家做個參考。一起跟隨小編過來看看吧。

創(chuàng)新互聯(lián)建站，專注為中小企業(yè)提供官網(wǎng)建設、營銷型網(wǎng)站制作、成都響應式網(wǎng)站建設公司、展示型網(wǎng)站設計制作、成都網(wǎng)站建設等服務，幫助中小企業(yè)通過網(wǎng)站體現(xiàn)價值、有效益。幫助企業(yè)快速建站、解決網(wǎng)站建設與網(wǎng)站營銷推廣問題。

angular集成bootstrap4

1、打開終端，輸入命令新建一個angular app

ng new app

2、集成bootstrap

安裝ngx-bootstrap 和Bootstrap

在新建的項目中打開終端，運行如下命令

npm install ngx-bootstrap bootstrap --save

3、使用bootstrap樣式

配置項目：必須將項目其配置為包括Bootstrap CSS，才能使用bootstrap的樣式。

在angular.json中增加bootstrap的樣式：從項目的根目錄打開文件angular.json，找到Style配置項，指定bootstrap.min.css的路徑。完成后，它應如下所示：

"styles": [
              "src/styles.sass",
              "./node_modules/bootstrap/dist/css/bootstrap.min.css"
            ],

注意：對angular.json進行更改時，您將需要重新啟動ng服務以獲取配置更改。

4、在app.module.ts中引入要使用的ngx-bootstrap module

打開src/app/app.module.ts 并添加想要使用的組件module，例如BsDropdownModule.forRoot()。

import { BsDropdownModule } from 'ngx-bootstrap/dropdown';
...

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

感謝各位的閱讀！關于angular如何集成bootstrap4就分享到這里了，希望以上內容可以對大家有一定的幫助，讓大家可以學到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到吧！

當前題目：angular如何集成bootstrap4-創(chuàng)新互聯(lián)
瀏覽路徑：http://www.rwnh.cn/article8/dghhop.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供定制開發(fā)、網(wǎng)站收錄、域名注冊、靜態(tài)網(wǎng)站、營銷型網(wǎng)站建設、標簽優(yōu)化

廣告

聲明：本網(wǎng)站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯(lián)