本文为翻译文档。原文是https://angular-ui.github.io/bootstrap/(需要翻墙)。

准备工作:

依赖关系:这个库中包含一组基于Bootstrap组件和CSS的原生AngularJS指令。致使UIBootstrap是不依赖jQuery和Bootstrap的js文件的。这仅仅需要依赖着:

  • AngularJS
  • Bootstrap CSS

文件的下载可以从官网中下载。

安装

只要你有所有文件下载并包含在你的页面中,你只需要在ui.bootstrap模块中申请依赖关系。

angular.module('myModule',['ui.bootstrap']);

你可以从这个页面中看到这里描述的工作示例。

CSS

最初引导的CSS取决于空href属性,来为几个组件添加样式游标(分页,标签等),但是在AngularJS中添加空的href属性将会导致不必要的路线的更改。这就是为什么我们需要从指示结果模板和样式不正确的应用中删除空的href链接。解决办法很简单,只要将下面的样式添加到你的应用程序中:

.nav, .pagination, .carousel, .panel-title a { cursor: pointer; }

Accordion

Alert

Buttons

Carousel

Collapse

Datepicker

Dropdown

Modal

Pagination

Popover

Progressbar

Rating

Tabs

Timepicker

Tooltip

Typeahead

 

UIBootatrap:是由AngularJS UI团队编写的纯AngularJS实现的Bootstrap组件的更多相关文章

  1. angularjs UI Libraries

    angularjs UI Libraries ● ng-bootstrap is currently available. ● PrimeNG has largest number of compon ...

  2. Angular -ui - BootStrap组件的解释以及使用

    关于UI BootStrap UI BootStrap 是angularUI团队用纯粹angularJS语法编写的Bootstrap组件. 1. 关于ng-router(angular-router. ...

  3. 再谈angularJS数据绑定机制及背后原理—angularJS常见问题总结

    这篇是对angularJS的一些疑点回顾,是对目前angularJS开发的各种常见问题的整理汇总.如果对文中的题目全部了然于胸,觉得对整个angular框架应该掌握的七七八八了.希望志同道合的通知补充 ...

  4. AngularJS进阶(三十一)AngularJS项目开发技巧之获取模态对话框中的组件ID

    AngularJS项目开发技巧之获取模态对话框中的组件ID 需求 出于项目开发需求,需要实现的业务逻辑是:药店端点击查看"已发货""已收货"订单详情时,模块弹出 ...

  5. angularjs源码分析之:angularjs执行流程

    angularjs用了快一个月了,最难的不是代码本身,而是学会怎么用angular的思路思考问题.其中涉及到很多概念,比如:directive,controller,service,compile,l ...

  6. 你会用AngularJS,但你会写AngularJS文档么?

    你会用AngularJS,但你会写AngularJS文档么? 涉及知识:gulp javascript 我们经常在写代码的时候要求写好注释,方便日后维护.但其实注释还有一个重要的用途:生成API文档. ...

  7. Android中实时预览UI和编写UI的各种技巧

    一.啰嗦 之前有读者反馈说,你搞这个所谓的最佳实践,每篇文章最后就给了一个库,感觉不是很高大上.其实,我在写这个系列之初就有想过这个问题.我的目的是:给出最实用的库来帮助我们开发,并且尽可能地说明这个 ...

  8. [转]AngularJS+UI Router(1) 多步表单

    本文转自:https://www.zybuluo.com/dreamapplehappy/note/54448 多步表单的实现   在线demo演示地址https://rawgit.com/dream ...

  9. angularJS ui router 多视图单独刷新问题

    场景:视图层级如下 view1 --view11 --view111 需求:view11的一个动作过后,单独刷新view12 解决方式:修改层级设计 view1 --view11 --view111 ...

随机推荐

  1. openmp 并行求完数

    // GetWanShu.cpp : 定义控制台应用程序的入口点. // #include "stdafx.h" #include "omp.h" #inclu ...

  2. OC:Block语法、Block使用、Block实现数组排序

    Block //定义一个求两个数最大值函数 int maxValue (int ,int); //函数的实现 int maxValue (int a, int b){ return  a > b ...

  3. EasyMock使用说明

    来自官网的使用说明,原文见http://www.easymock.org/EasyMock2_0_Documentation.html 1.1. 准备 大多数的软件系统都不是单独运行的,它们都需要于其 ...

  4. oracle表空间建立与用户创建删除

    --创建临时表空间 --//Linux下的文件系统 create temporary tablespace cloudv2_temp tempfile '/home/oracle/app/oracle ...

  5. HTTP(一) 连接管理

    ・HTTP是如何使用TCP连接的 HTTP传送一条报文时,以流的形式将报文数据内容通过一条打开的TCP连接按序传输. TCP收到数据流之后,由TCP/IP软件将数据流砍成被称作段的小数据块,并将段封装 ...

  6. RESTful Webservice (一) 概念

    Representational State Transfer(表述性状态转移) RSET是一种架构风格,其核心是面向资源,REST专门针对网络应用设计和开发方式,以降低开发的复杂性,提高系统的可伸缩 ...

  7. Android - Facebook KeyHash 設定

    转自:http://www.dotblogs.com.tw/newmonkey48/archive/2014/04/17/144779.aspx App要使用Facebook 分享時,設要在Faceb ...

  8. uva10327 - Flip Sort

    Flip Sort Sorting in computer science is an important part. Almost every problem can be solved effec ...

  9. Win7环境下VS2010配置Cocos2d-x-2.1.4最新版本号的开发环境

    写这篇博客时2D游戏引擎Cocos2d-x的最新版本号为2.1.4,记得非常久曾经使用博客园博主子龙山人的一篇博文<Cocos2d-x win7+vs2010配置图文具体解释(亲測)>成功 ...

  10. ReactNative学习实践--动画初探之加载动画

    学习和实践react已经有一段时间了,在经历了从最初的彷徨到解决痛点时的兴奋,再到不断实践后遭遇问题时的苦闷,确实被这一种新的思维方式和开发模式所折服,react不是万能的,在很多场景下滥用反而会适得 ...