源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

ng2学习笔记之bootstrap中的component使用教程

  • 时间:2021-02-08 00:51 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:ng2学习笔记之bootstrap中的component使用教程
[b] 前序:[/b] 现在angular2已经除了集成的angular-cli,建议大家可以基于这个来快速开发ng2的项目,不用自己再搭建环境; 相关内容请前往:[url=https://angular.cn/docs/ts/latest/cli-quickstart.html]https://angular.cn/docs/ts/latest/cli-quickstart.html[/url] [b]正文:[/b] 以图片轮播组件carousel为例: 首先安装好ng2-bootstrap,bootstrap
npm install ng2-bootstrap bootstrap --save
在需要用到的模块中导入
import { CarouselModule } from 'ng2-bootstrap'
@NgModule({
 imports: [
  CarouselModule.forRoot()
 ],
})
export class HeaderModule { }
然后,有很重要一点,不要忘记引入了bootstroop.min.css文件; 接着,在组件的html中写入
<carousel [interval]="myInterval" [noWrap]="noWrapSlides" [(activeSlide)]="activeSlideIndex">
 <slide *ngFor="let slidez of slides;">
  <img [src]="slidez" >
 </slide>
</carousel>
以上所述是小编给大家介绍的ng2学习笔记之bootstrap中的component使用教程,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对编程素材网网站的支持!
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部