liumang361

导航

随笔分类 -  AngularJs

AngularJs项目实践总结
摘要:今年3月接触AngularJs,并且在6月的项目中开始应用,从踩坑到填坑花了不少时间,根据项目中的实际应用情况总结了一些经验,如下: 一.UI控件选择 Angularjs是不缺控件的,Github里现成的控件非常丰富,基本上足以应付一个普通管理系统中常见的控件需求。但是控件的丰富会带来选择的困难。选 阅读全文

posted @ 2016-10-19 20:33 pilixiami 阅读(3101) 评论(10) 推荐(4) 编辑

AngularJs的UI组件ui-Bootstrap分享(十四)——Carousel
摘要:Carousel指令是用于图片轮播的控件,引入ngTouch模块后可以在移动端使用滑动的方式使用轮播控件。 1 <!DOCTYPE html> 2 <html ng-app="ui.bootstrap.demo" xmlns="http://www.w3.org/1999/xhtml"> 3 <he 阅读全文

posted @ 2016-08-01 13:08 pilixiami 阅读(6420) 评论(3) 推荐(0) 编辑

AngularJs的UI组件ui-Bootstrap分享(十三)——Progressbar
摘要:进度条控件有两种指令,第一种是uib-progressbar指令,表示单一颜色和进度的一个进度条。第二种是uib-bar和uib-progress指令,表示多种颜色和多个进度组合而成的一个进度条。 这是一个使用uib-progressbar指令的例子: 1 <!DOCTYPE html> 2 <ht 阅读全文

posted @ 2016-07-31 22:54 pilixiami 阅读(4964) 评论(0) 推荐(0) 编辑

AngularJs的UI组件ui-Bootstrap分享(十二)——Rating
摘要:Rating是一个用于打分或排名的控件。看一个最简单的例子: 1 <!DOCTYPE html> 2 <html ng-app="ui.bootstrap.demo" xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv= 阅读全文

posted @ 2016-07-31 18:01 pilixiami 阅读(3495) 评论(2) 推荐(1) 编辑

AngularJs的UI组件ui-Bootstrap分享(十一)——Typeahead
摘要:Typeahead指令是一个用于智能提示或自动完成的控件,就像Jquery的AutoComplete控件一样。来看一个最简单的例子: 1 <!DOCTYPE html> 2 <html ng-app="ui.bootstrap.demo" xmlns="http://www.w3.org/1999/ 阅读全文

posted @ 2016-07-31 14:54 pilixiami 阅读(6034) 评论(0) 推荐(1) 编辑

AngularJs的UI组件ui-Bootstrap分享(九)——Alert
摘要:alert指令会在页面上显示一条提示消息,效果是这样: 代码为: 1 <!DOCTYPE html> 2 <html ng-app="ui.bootstrap.demo" xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equi 阅读全文

posted @ 2016-07-23 21:40 pilixiami 阅读(6052) 评论(0) 推荐(0) 编辑

AngularJs的UI组件ui-Bootstrap分享(八)——Tooltip和Popover
摘要:tooltip和popover是轻量的、可扩展的、用于提示的指令。对于移动端来讲,这两个指令虽然可以正常工作,但是从用户体验的角度并不推荐使用。 先说tooltip,tooltip有三种使用方式: (1) uib-tooltip 定义提示的文本 (2)uib-tooltip-html 定义提示的ht 阅读全文

posted @ 2016-07-16 22:49 pilixiami 阅读(16695) 评论(2) 推荐(0) 编辑

AngularJs的UI组件ui-Bootstrap分享(六)——Tabs
摘要:tabs控件使用uib-tabset指令和uib-tab指令,效果是这样的: 1 <!DOCTYPE html> 2 <html ng-app="ui.bootstrap.demo" xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta htt 阅读全文

posted @ 2016-07-02 22:21 pilixiami 阅读(18188) 评论(4) 推荐(1) 编辑

AngularJs的UI组件ui-Bootstrap分享(五)——Pager和Pagination
摘要:ui-bootstrap中有两个分页控件,一个是轻量级的Pager,只有上一页和下一页的功能,另一个是功能完整的Pagination,除了上一页和下一页,还可以选择首页和最后页,并且支持多种页数的显示方式。 这是Pager的例子: 1 <!DOCTYPE html> 2 <html ng-app=" 阅读全文

posted @ 2016-07-01 23:38 pilixiami 阅读(17770) 评论(0) 推荐(3) 编辑

AngularJs的UI组件ui-Bootstrap分享(四)——Datepicker Popup
摘要:Datepicker Popup是用来选择日期的控件,一般和文本框一起使用,功能和Jquery的插件My97DatePicker一样。在Datepicker Popup内部使用了ui-bootstrap的另一个组件Datepicker,是Datepicker的扩展。 使用Datepicker Pop 阅读全文

posted @ 2016-06-23 20:52 pilixiami 阅读(28357) 评论(2) 推荐(2) 编辑

AngularJs的UI组件ui-Bootstrap分享(三)——Accordion
摘要:Accordion手风琴控件使用uib-accordion和uib-accordion-group指令。 效果为: uib-accordion的属性: 属性名称 默认值 说明 close-others true 展开一个面板时是否关闭其他面板 template-url template/accord 阅读全文

posted @ 2016-06-19 23:52 pilixiami 阅读(12761) 评论(1) 推荐(0) 编辑

AngularJs的UI组件ui-Bootstrap分享(二)——Collapse
摘要:Collapse折叠控件使用uib-collapse指令 1 <!DOCTYPE html> 2 <html ng-app="ui.bootstrap.demo" xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="C 阅读全文

posted @ 2016-06-19 12:32 pilixiami 阅读(10208) 评论(0) 推荐(0) 编辑

AngularJs的UI组件ui-Bootstrap分享(一)
摘要:最近几个月学习了AngularJs和扩展的UI组件,并在公司小组内做了一次分享交流,感觉很有收获,在此记录下个人的学习心得。 目录: AngularJs的UI组件ui-Bootstrap分享(一) AngularJs的UI组件ui-Bootstrap分享(二)——Collapse AngularJs 阅读全文

posted @ 2016-06-19 11:04 pilixiami 阅读(27211) 评论(1) 推荐(3) 编辑