`
weitao1026
  • 浏览: 1064484 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

AngularJS常用插件与指令收集

 
阅读更多

使用AngularJS有差不多一年时间了,前前后后也用了不少库和指令,整理了一下,分成四大类列出。有demo地址的,就直接连接到demo地址,其它的直接链到github托管库中。

图片视频类

  • angular-maxonry 图片墙效果插件,可以将图片组织成类似于瀑布流的效果,依赖于jQuery、imageloadedMasonry
  • angular-deckgrid 另一个照片瀑布流解决方案
  • ngImgCrop 图片剪裁工具
  • ngVideo 播放器,直接播放指定地址的mp4,控制按钮美观度远甩朝内99.99%的视频站
  • angular-image-404 当 img 元素的图片无法正常获取时,使用这个指令可以显示占位图片,可以自定义占位图,也可以使用默认的占位图

输入控件类

  • ngDraggable 控制元素拖动的控件,Demo
  • ui-sortable 以拖动的方式调整数组中元素的索引和位置,依赖 jQuery 和 jQuery-ui。Demo
  • ngAutocomplete 喜闻乐见的自动补完
  • textAngular 文本编辑器,更简洁,更漂亮
  • ngTagsInput 以标签的方式来组织输入
  • Angular-slider 以拖动方式输入值的控件
  • Angular Slidezilla 与Angular-slider功能一样,只不过设计风格不一样
  • Checklist-model AngularJS 多选框输入的值处理得并不好,通过这个指令,可以方便的将多选框的值直接组织成数组

文本编辑器

  • textAngular 在 Github 中排名第一的 HTML 编辑器, Demo(需FQ)
  • Angular Froala 非常好用的另外一个 HTML 编辑器,而且支持 inline 编辑,比 textAngular 漂亮,Github
  • angular-umeditor 百度umeditor的AngularJS扩展,umeditor从界面上讲并不够现代化,但却总有人喜欢它

界面类

  • 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-fallback-image 当你的图片地址返回的是 404 的时候,使用这个插件可以将其替换为另外的占位图

其它工具类

  • angular-translate AngularJS的i18n扩展
  • Satellizer 可以方便的在AngularJS中集成第三方账号登陆,支持国际主流社交网站账号,支持协议有OAuth 1.0/2.0
  • ngStorage 本在存储插件,用于处理localStorage和sessionStorage
  • ng-csv 导出csv的扩展
  • angular-once 双向绑定虽然方便,但如果数据太多,会造成一些性能问题。angular-once的解决方案是,对于不涉及到修改的数据,不要使用双向绑定,而是使用angular-once提供的once-textonce-src等等。
分享到:
评论

相关推荐

    matlab代码做游戏-Machine-Learning-And-Statistics-Repos:机器学习和统计资料存储库的有用列表

    -用于NVD3可重用图表库的AngularJS指令(基于D3)。 通过JSON API轻松自定义您的图表。 -C ++ / Python中的近似最近邻居已针对内存使用情况以及加载/保存到磁盘进行了优化 -CMU ARK Twitter词性标注器 -探索在其他...

    pigeon:带电视指南的通用遥控器

    此外,JavaScript还可以与Cordova插件交互,以访问设备的硬件特性,如蓝牙或红外线,以实现对电视的控制。 3. **用户研究原型**:作为用户研究的原型,"鸽子"可能包含了一系列的交互设计和功能测试,目的是评估用户...

    awesome-angular-graphql:精选的资源,客户端和工具集合,使使用`GraphQL和Angular`更加出色

    `awesome-angular-graphql`项目就是这样一个资源库,它收集了各种有助于开发人员更好地利用GraphQL和Angular的工具、库和教程。 首先,让我们深入理解一下GraphQL。GraphQL提供了一种声明性的方式来获取数据,允许...

    sashakt-kisaan:播种季节和统计农民指南

    《萨沙克特(Sashakt Kisaan):播种季节与统计农民指南》 萨沙克特(Sashakt Kisaan)是一款基于天气报告的农作物分析工具,旨在为农民提供科学的播种指导和统计数据,帮助他们做出更加明智的农业决策。这款应用的...

    [附源码+数据库+毕业论文+部署教程+配套软件]基于SpringBoot+MyBatis+MySQL+Maven+Vue的停车场管理系统,推荐!

    一、项目简介 包含:项目源码、数据库脚本等,该项目附带全部源码可作为毕设使用。 项目都经过严格调试,eclipse或者idea 确保可以运行! 该系统功能完善、界面美观、操作简单、功能齐全、管理便捷 二、技术实现 jdk版本:1.8 及以上 ide工具:IDEA或者eclipse 数据库: mysql5.5及以上 后端:spring+springboot+mybatis+maven+mysql 前端: vue , css,js , elementui 三、系统功能 1、系统角色主要包括:管理员、用户 2、系统功能 前台功能包括: 用户登录 车位展示 系统推荐车位 立即预约 公告展示 个人中心 车位预定 违规 余额充值 后台功能: 首页,个人中心,修改密码,个人信息 用户管理 管理员管理 车辆管理 车位管理 车位预定管理,统计报表 公告管理 违规管理 公告类型管理 车位类型管理 车辆类型管理 违规类型管理 轮播图管理 详见 https://flypeppa.blog.csdn.net/article/details/146122666

    springboot656基于java-springboot的农机电招平台毕业设计(代码+数据库+论文+PPT+演示录像+运行教学+软件下载).zip

    项目已获导师指导并通过的高分毕业设计项目,可作为课程设计和期末大作业,下载即用无需修改,项目完整确保可以运行。 包含:项目源码、数据库脚本、软件工具等,该项目可以作为毕设、课程设计使用,前后端代码都在里面。 该系统功能完善、界面美观、操作简单、功能齐全、管理便捷,具有很高的实际应用价值。 项目都经过严格调试,确保可以运行!可以放心下载 技术组成 语言:java 开发环境:idea 数据库:MySql 部署环境:maven 数据库工具:navica 更多毕业设计https://cv2022.blog.csdn.net/article/details/124463185

    Python程序设计学习思维导图-仅供参考

    内容为Python程序设计的思维导图,适用于新手小白进行浏览,理清思路

    2024-Stable Diffusion全套资料(软件+关键词+模型).rar

    2024-Stable Diffusion全套资料(软件+关键词+模型).rar

    mmexport1741417035005.png

    mmexport1741417035005.png

    COMSOL三维锂离子电池全耦合电化学热应力模型:模拟充放电过程中的多物理场耦合效应及电芯内应力应变情况,COMSOL锂离子电池热应力全耦合模型,comsol三维锂离子电池电化学热应力全耦合模型锂离子

    COMSOL三维锂离子电池全耦合电化学热应力模型:模拟充放电过程中的多物理场耦合效应及电芯内应力应变情况,COMSOL锂离子电池热应力全耦合模型,comsol三维锂离子电池电化学热应力全耦合模型锂离子电池耦合COMSOL固体力学模块和固体传热模块,模型仿真模拟电池在充放电过程中由于锂插层,热膨胀以及外部约束所导致的电极的应力应变情况结果有电芯中集流体,电极,隔膜的应力应变以及压力情况等,电化学-力单向耦合和双向耦合 ,关键词: 1. COMSOL三维锂离子电池模型; 2. 电化学热应力全耦合模型; 3. 锂离子电池; 4. 固体力学模块; 5. 固体传热模块; 6. 应力应变情况; 7. 电芯中集流体; 8. 电极; 9. 隔膜; 10. 电化学-力单向/双向耦合。,COMSOL锂离子电池全耦合热应力仿真模型

    基于传递矩阵法的一维层状声子晶体振动传输特性及其优化设计与应用,声子晶体传递矩阵法解析及应用,Matlab 一维层状声子晶体振动传输特性 传递矩阵法在声子晶体的设计和应用中具有重要作用 通过调整声子

    基于传递矩阵法的一维层状声子晶体振动传输特性及其优化设计与应用,声子晶体传递矩阵法解析及应用,Matlab 一维层状声子晶体振动传输特性 传递矩阵法在声子晶体的设计和应用中具有重要作用。 通过调整声子晶体的材料、周期和晶格常数等参数,可以设计出具有特定带隙结构的声子晶体,用于滤波、减震、降噪等应用。 例如,通过调整声子晶体的周期数和晶格常数,可以改变带隙的位置和宽度,从而实现特定的频率范围内的噪声控制。 此外,传递矩阵法还可以用于分析和优化声子晶体的透射谱,为声学器件的设计提供理论依据。 ,Matlab; 一维层状声子晶体; 振动传输特性; 传递矩阵法; 材料调整; 周期和晶格常数; 带隙结构; 滤波; 减震; 降噪; 透射谱分析; 声学器件设计,Matlab模拟声子晶体振动传输特性及优化设计研究

    头部姿态估计(HeadPose Estimation)-Android源码

    头部姿态估计(HeadPose Estimation)-Android源码

    永磁同步电机FOC、MPC与高频注入Simulink模型及基于MBD的代码生成工具,适用于Ti f28335与dspace/ccs平台开发,含电机控制开发文档,永磁同步电机控制技术:FOC、MPC与高

    永磁同步电机FOC、MPC与高频注入Simulink模型及基于MBD的代码生成工具,适用于Ti f28335与dspace/ccs平台开发,含电机控制开发文档,永磁同步电机控制技术:FOC、MPC与高频注入Simulink模型开发及应用指南,提供永磁同步电机FOC,MPC,高频注入simulink模型。 提供基于模型开发(MBD)代码生成模型,可结合Ti f28335进行电机模型快速开发,可适用dspace平台或者ccs平台。 提供电机控制开发编码器,转子位置定向,pid调试相关文档。 ,永磁同步电机; FOC控制; MPC控制; 高频注入; Simulink模型; 模型开发(MBD); Ti f28335; 电机模型开发; dspace平台; ccs平台; 编码器; 转子位置定向; pid调试。,永磁同步电机MPC-FOC控制与代码生成模型

    light of warehouse.zip

    light of warehouse.zip

    考虑温度和气体排放等因素的工业乙醇发酵过程及其Matlab源码-乙醇发酵-气体排放-Matlab建模和仿真-代谢路径

    内容概要:文章深入讨论了工业乙醇发酵的基本原理及工艺流程,特别是在温度和气体排放(如CO2及其他有害气体)影响下的发酵效果分析。文章介绍了乙醇发酵的重要环节,如糖分解、代谢路径、代谢调控以及各阶段的操作流程,重点展示了如何通过Matlab建模和仿真实验来探索这两个关键环境因素对发酵过程的具体影响。通过动态模型仿真分析,得出合适的温度范围以及适时排除CO2能显著提升发酵产乙醇的效果与效率,从而提出了基于仿真的优化发酵生产工艺的新方法。 适用人群:从事生物工程相关领域研究的科学家、工程师及相关专业师生。 使用场景及目标:适用于实验室环境、学术交流会议及实际生产指导中,以提升研究人员对该领域内复杂现象的理解能力和技术水平为目标。 其他说明:附录中有详细的数学公式表达和程序代码可供下载执行,便于有兴趣的研究团队重复实验或者继续扩展研究工作。

    Tomcat资源包《Tomcat启动报错:CATALINA-HOME环境变量未正确配置的完整解决方案》

    本资源包专为解决 Tomcat 启动时提示「CATALINA_HOME 环境变量未正确配置」问题而整理,包含以下内容: 1. **Apache Tomcat 9.0.69 官方安装包**:已验证兼容性,解压即用。 2. **环境变量配置指南**: - Windows 系统下 `CATALINA_HOME` 和 `JAVA_HOME` 的详细配置步骤。 - 常见错误排查方法(如路径含空格、未生效问题)。 3. **辅助工具脚本**:一键检测环境变量是否生效的批处理文件。 4. **解决方案文档**:图文并茂的 PDF 文档,涵盖从报错分析到成功启动的全流程。 适用场景: - Tomcat 9.x 版本环境配置 - Java Web 开发环境搭建 - 运维部署调试 注意事项: - 资源包路径需为纯英文,避免特殊字符。 - 建议使用 JDK 8 或更高版本。

    java毕业设计源码 仿360buy京东商城源码 京东JavaWeb项目源代码

    这是一款仿照京东商城的Java Web项目源码,完美复现了360buy的用户界面和购物流程,非常适合Java初学者和开发者进行学习与实践。通过这份源码,你将深入了解电商平台的架构设计和实现方法。欢迎大家下载体验,提升自己的编程能力!

    java-springboot+vue的乒乓球馆预约管理系统源码.zip

    系统选用B/S模式,后端应用springboot框架,前端应用vue框架, MySQL为后台数据库。 本系统基于java设计的各项功能,数据库服务器端采用了Mysql作为后台数据库,使Web与数据库紧密联系起来。 在设计过程中,充分保证了系统代码的良好可读性、实用性、易扩展性、通用性、便于后期维护、操作方便以及页面简洁等特点。

    【javaweb毕业设计源码】大学生求职就业网

    这是一款专为大学生打造的求职就业网JavaWeb毕业设计源码,功能齐全,界面友好。它提供简历投递、职位搜索、在线交流等多种实用功能,能够帮助你顺利进入职场。无论你是想提升技术水平还是寻找灵感,这个源码都是不可多得的资源。快来下载,让你的求职之路更加顺畅吧!

    useTable(1).ts

    useTable(1).ts

Global site tag (gtag.js) - Google Analytics