ng2學(xué)習(xí)筆記之bootstrap中的component使用教程
更新時(shí)間：2017年03月09日 09:05:56 作者：Benson.Cai
現(xiàn)在angular2已經(jīng)除了集成的angular-cli，建議大家可以基于這個(gè)來快速開發(fā)ng2的項(xiàng)目，不用自己再搭建環(huán)境。接下來通過本文給大家介紹 bootstrap中的component使用教程,需要的朋友可以參考下
前序：
現(xiàn)在angular2已經(jīng)除了集成的angular-cli，建議大家可以基于這個(gè)來快速開發(fā)ng2的項(xiàng)目，不用自己再搭建環(huán)境；
相關(guān)內(nèi)容請(qǐng)前往：https://angular.cn/docs/ts/latest/cli-quickstart.html
正文：
以圖片輪播組件carousel為例：
首先安裝好ng2-bootstrap,bootstrap
npm install ng2-bootstrap bootstrap --save
在需要用到的模塊中導(dǎo)入
import { CarouselModule } from 'ng2-bootstrap'
@NgModule({
imports: [
CarouselModule.forRoot()
],
})
export class HeaderModule { }
然后，有很重要一點(diǎn)，不要忘記引入了bootstroop.min.css文件；
接著，在組件的html中寫入
<carousel [interval]="myInterval" [noWrap]="noWrapSlides" [(activeSlide)]="activeSlideIndex"> <slide *ngFor="let slidez of slides;"> <img [src]="slidez" > </slide> </carousel>
以上所述是小編給大家介紹的ng2學(xué)習(xí)筆記之bootstrap中的component使用教程，希望對(duì)大家有所幫助，如果大家有任何疑問請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
相關(guān)文章
Angularjs 實(shí)現(xiàn)分頁功能及示例代碼
這篇文章主要介紹了Angularjs 實(shí)現(xiàn)分頁功能及示例代碼的相關(guān)資料,需要的朋友可以參考下2016-09-09
AngularJs 利用百度地圖API 定位當(dāng)前位置 獲取地址信息
本文主要介紹了AngularJs 利用百度地圖API 定位當(dāng)前位置 獲取地址信息的方法步驟。具有一定的參考價(jià)值，下面跟著小編一起來看下吧2017-01-01
這篇文章主要為大家詳細(xì)介紹了9種改善AngularJS性能的方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-11-11
本文主要介紹AngularJS國(guó)際化的知識(shí)，這里整理了相關(guān)資料和示例代碼以及實(shí)現(xiàn)效果圖，有興趣的小伙伴可以參考下2016-08-08
淺談Angular4實(shí)現(xiàn)熱加載開發(fā)旅程
本篇文章主要介紹了淺談Angular4實(shí)現(xiàn)熱加載開發(fā)旅程，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-09-09
AngularJS中directive指令使用之事件綁定與指令交互用法示例
這篇文章主要介紹了AngularJS中directive指令使用之事件綁定與指令交互用法,結(jié)合實(shí)例形式分析了directive指令在模板的使用，事件的綁定及元素、屬性、控制器之間的交互相關(guān)操作技巧,需要的朋友可以參考下2016-11-11
詳解angularJs中關(guān)于ng-class的三種使用方式說明
本篇文章主要介紹了angularJs中關(guān)于ng-class的三種使用方式說明，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-06-06
這篇文章主要為大家介紹了angular父子組件通信，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助2021-12-12
Angularjs全局變量被作用域監(jiān)聽的正確姿勢(shì)
這篇文章主要介紹了Angularjs全局變量被作用域監(jiān)聽的正確姿勢(shì)的相關(guān)資料,需要的朋友可以參考下2016-02-02
利用Angular.js限制textarea輸入的字?jǐn)?shù)
相信在大家已經(jīng)學(xué)習(xí)了足夠多關(guān)于AngularJS的知識(shí)后，就可以開始創(chuàng)建第一個(gè)AngularJS應(yīng)用程序，這篇文章通過示例給大家介紹如何利用Angular.js限制textarea輸入的字?jǐn)?shù)，有需要的朋友們可以參考借鑒，下面來一起看看吧。2016-10-10