Angular 常用指令和插件有哪些?
从2014年底开始接触 Angular 现在已经一年半的时间了。虽然没有一只用这个插件,但是用的也不少。根据平时的项目需求,收集了一些常用的指令和插件分享给大家。刚接触的小伙伴可以看看教程《Angular 高清视频》。
图片视频类
- angular-maxonry 图片墙效果插件,可以将图片组织成类似于瀑布流的效果,依赖于jQuery、imageloaded和Masonry
- angular-deckgrid 另一个照片瀑布流解决方案
- ngImgCrop 图片剪裁工具
- ngVideo 播放器,直接播放指定地址的mp4,控制按钮美观度远甩朝内99.99%的视频站
输入控件类
- ngDraggable 控制元素拖动的控件,Demo
- angular-umeditor 百度umeditor的AngularJS扩展,umeditor从界面上讲并不够现代化,但却总有人喜欢它
- ngAutocomplete 喜闻乐见的自动补完
- textAngular 文本编辑器,更简洁,更漂亮
- ngTagsInput 以标签的方式来组织输入
- Angular-slider 以拖动方式输入值的控件
- Angular Slidezilla 与Angular-slider功能一样,只不过设计风格不一样
界面类
- ui-bootstrap 官方扩展,在AngularJS中方便的以指令的方式使用Bootstrap
- ui-map 用于在页面中集成Google Maps
- NG-Grid 官方提供的表格插件,支持表格的主题、排序、直接编辑、多行选择等操作,而且使用非常简单,只需要一行HTML代码,但是,比较难看,适合于不讲究外观但要求功能强大的场合,像后台工具、管理系统之类
- angular-table 第三方表格工具,适合于需要对表格进行高度定制的场合
- ng-table 在易用性和外观上对上面两个进行折衷的解决方案
- AngularUI 上面的ui-bootstrap、ui-map就是它的一部分,官方提供的常用扩展集,除了这两个,还有ui-router、ui-select等,注意,它使用的是Bootstrap 2.x
- Adapt-Strap 第三方Bootstrap插件,而且是基于扁平化的Bootstrap 3,更美观
- ng-polymer-elements Polymer风格的AngularJS指令,Material Design设计,值得尝试
- Angular Loading Bar 可用于在页面顶部增加一个漂亮的进度条
- angular-busy 与Angular Loading Bar有点类似,主要用于处理$http通信时候的动画
- ngInfiniteScroll 从名字可以看出来,它是一个用于组织瀑布流和时间线的扩展
- ngScrollTo 页内滚动工具,可以将页面滚动到指定id的元素位置
- ngDialog 比Bootstrap更简单,更好用,更漂亮的网页对话框
- Angular Treeview 树状目录组织扩展,使用相当方便,而且不依赖于jQuery
- angular-growl 用于在页面上显示警告框,可以设置显示时间,还可以直接显示$http中收到的警告
- angular-truncate 当文字过多过长时,显示部分文字的插件,可以按文字总长度来控制,也可以按单词数量来控制
其它工具类
- angular-translate AngularJS的i18n扩展
- Satellizer 可以方便的在AngularJS中集成第三方账号登陆,支持国际主流社交网站账号,支持协议有OAuth 1.0/2.0
- ngStorage 本在存储插件,用于处理localStorage和sessionStorage
- ng-csv 导出csv的扩展