几天前我们看到Angular 1.4.0发布了-一个以社团为驱动的发布版本涵盖了400多个GitHub的提交,增加了对特性的提升,比如动画,以及可用性。 官方新闻发布稿 覆盖了绝大部分,这同样值得放于 官方版本库 中。

Angular.js   是一个神奇的JS框架,这一点毫无疑问,但是尽管受欢迎度和社团日益增长,但是社团中的很多开发者觉得Angular是另外一种浪费个人时间和效率的形式。在这些最不招人喜欢的问题中你会发现,测试和调试简直就是一个噩梦。你可以从网络上找到一些分散的报告, 这里有一些 ;一个深入的观点关于为何你一点儿都不应该选择Angular。

搁置这些争议,我们不在这里分析这个框架的优劣,而是着重介绍如何利用额外的部件和工具,去扩展既存的 Angular 文件,帮助我们成为更好的开发者。这里要介绍的,是一些非常有用的 Angular.js 指令,能助力扩展你的应用,让你无需辛苦地编码,就能给应用一个新的体验和模样。

angular-lazytube

使用这个指令,你可以不用再依赖于笨重的一直都要加载的iframe了,Angular.js的LazyTube指令是用来帮助你轻松的加载视频,视频将会被优雅的分解并且给你的用户一个无缝的体验。

Angular PDF Viewer

Angular可以做很多事情(正如你将在这个贴里看到的),其中有一个是让你的用户从浏览器中直接阅读PDF文件,尽管很多浏览器都提供了这个功能,但是它更加友好的让用户在浏览器中看而不需要单独下载。

angular morris chart

如果你知道这个神奇的JS库中的morris.js,那么你会爱上这个指令。它允许你将直接morris.js的好处运用到你的Angular.js工程中。用到你图表上吧!

ng-readingtime

你是否曾经遇到一些网站或者博客,这些网站和博客共享内容的同时,同样提供给你你要花多久去读这些内容?这条指令就是被用来实现这个目的的,在某些情况下这个指令被证明很有用,比如要花费多久去阅读一些内容。

Angular-auto-validate

一个为AngularJS自动校验的模块,它支持动态元素修改来消除多余的HTML,并且给用户校验错误的提示。

ngEmbed

一个AngularJS过滤器/指令,它可以将文本变为表情符号,嵌入视频(youtube/vimeo/mp4,ogg),音频,PDF,高亮代码语法以及以一个普通的文本字符串形式嵌入任何服务。

ng-lazy-image

如视频一样,图片有时候也会很耗费带宽,对于那些提供大量图片的站点,使用Lazy image加载会是一个不错的主意。响应式的图片会更棒。

scroll-trigger

任何建立在 Angular.js之上的商业化的站点/工程,都应该利用这条指令,它允许你建立一个智能渠道,这个渠道可以获取如下内容:到当一个站点的特定部分被访问到时,说明这个用户对你的产品或多或少感兴趣

angular-atomic-notify

不建立单独的消息通知条和消息盒子,可以为你节约大把的时间,这条指令可以提供任何你想要、以愉快和流畅的方式通知给你的用户。这个集成已经使用Font Awsome和JQuery完成。

Angular Grid

Angular Grid 是一种Angular.js构建指令,它在需要的时候使用Angular,但在其它任意地方都支持原生态的JavaScript。一个由只使用Angular的这种指令构建的网格,比起原生态语言构建的,明显要慢。其特性丰富,轻量级,最小的占用空间,并且没有外部依赖。Angular Grid会让你的应用程序运行的更快。

ngMeditor

你可曾见过过流行的博客网站Medium使用的编辑器?那是一件非常棒的工作,然而,也有许多人看起来并不喜欢它。把它放到你自己的Angular应用程序中可能意味着,你的使用者可以访问他们已经熟悉的东西。这就是Angular指令所提供的内容,一个简单易用的Medium内容编辑器的复制品。

Object-table

在过去的许多年中,Web技术日新月异,这个指令可能就正是其中的一个例子。我们再也不需要依赖风格匮乏的HTML表格,现在我们可以获取到类似Object-tables的表格,它是一个巧妙的Angular表格指令。尝试着用用吧!

Ng-sweet-alert

关于警告指令最棒的是,使用时,你无需编写额外的JavaScript代码,它会自然的集成所使用的HTML相关内容。它具备平滑的设计,通过测试这个例子,其中的过渡过程也非常平滑。

vButton

一个让你能创建指示性按钮非常简单的命令,内置的加载图标功能可以加强你的用户体验

vModal

你是否有过点击一个东西然后不得不在弹出的对话框中返回内容?这就是 vModal 为生成精确的方法而服务的。易于使用,流畅而且可以定制样式.

Angular.js应用指令

从修改来说,Angular.js 因为简单的可适应的指令,能在几分钟内从杂乱中生成,而脱颖而出;支持所有的前沿的技术,在应用中使用指令就像在其他的编程语言中使用类库.

在最重要的指令中,,我们已经提前分享了简单的方式 构建多语言的Angualr.js 应用 覆盖了 Angular.js 关联的内容。同样翻译了一系列 免费学习 Angular.js 框架书籍 中比较受欢迎的文章。当然我们也推荐您从我们的 最佳学习 ReactJS 资源 中获取最新的特性。一种Angular的竞争对手,但是也值得我们去检验。

推荐 15 个 Angular.js 应用扩展指令(参考应用)的更多相关文章

  1. Angular JS学习之指令

    1.Angular JS通过称为指令的新属性来扩展HTML:通过内置的指令来为应用添加功能: 2.AngularJS指令:AngularJS指令是扩展的HTML属性,带有前缀ng-: **ng-app ...

  2. Angular.js之自定义指令学习笔记

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  3. angular.js的ng-app 指令定义一个 AngularJS 应用程序。

    <!DOCTYPE html> <html lang="en" ng-app> <head> <meta charset="UT ...

  4. Ionic中基于js的扩展(指令和服务)来实现各种效果

    1.ion-header-bar ion-footer-bar ion-content align-title='left/ritght/center <body> <ion-hea ...

  5. angular.js的时间指令

    最后样式 html .input-group(style="max-width:150px") input.form-control(uib-datepicker-popup=&q ...

  6. angular.js的表格指令

    html div.col-sm-12 table.table.table-bordered.table-condensed.table-hover.table-striped.dataTable.no ...

  7. angular.js创建自定义指令-demo3

    html: <!doctype html><html ng-app="myModule"> <head> <meta charset=&q ...

  8. 史上最全的Angular.js 的学习资源

    Angular.js 的一些学习资源 基础 官方: http://docs.angularjs.org angularjs官方网站已被墙,可看 http://www.ngnice.com/: 官方zi ...

  9. Angular JS中$timeout的用法及其与window.setTimeout的区别

    $timeout的用法 angular.js的$timeout指令对window.setTimeout做了一个封装,它的返回值是一个promise对象.当定义的时间到了以后,这个promise对象就会 ...

随机推荐

  1. Codeforces Round #303 (Div. 2) E. Paths and Trees 最短路+贪心

    题目链接: 题目 E. Paths and Trees time limit per test 3 seconds memory limit per test 256 megabytes inputs ...

  2. EXT--表单AJax提交后台,返回前端数据格式的转换

    前言: 前端发送请求至服务端(Java),得到的数据是Java语言对象所表现的形式,经常需要转换为JSON格式的字符串写出至前端:当前端获取后也往往需要将字符串转换为js的对象.本文描述了在EXT作为 ...

  3. 用NPOI导出Excel

    用NPOI导出Excel public void ProcessRequest(HttpContext context) { context.Response.ContentType = " ...

  4. 时间序列数据库武斗大会之 KairosDB 篇

    [编者按] 刘斌,OneAPM后端研发工程师,拥有10多年编程经验,参与过大型金融.通信以及Android手机操作系的开发,熟悉Linux及后台开发技术.曾参与翻译过<第一本Docker书> ...

  5. 国内最大的 Node.js 社区将 New Relic 的监控产品换成了 OneAPM

    国内最知名的 CNode 社区把 New Relic 的监控产品换成了 OneAPM .难道 APM 的老大 New Relic 已经被 OneAPM 超越? 毋庸置疑,在全球应用性能管理 SaaS ...

  6. autocomplete参数说明以及实例

    JQuery autocomplete使用手册 Jquery autocomplete是一个很强大的类似google suggest的自动提示插件.它几乎可以满足我们所有的需要. 官方网站:http: ...

  7. POJ 2407 Relatives(欧拉函数)

    题目链接 题意 : 求小于等于n中与n互质的数的个数. 思路 : 看数学的时候有一部分是将欧拉函数的,虽然我没怎么看懂,但是模板我记得了,所以直接套了一下模板. 这里是欧拉函数的简介. #includ ...

  8. POJ 2993Emag eht htiw Em Pleh

    http://poj.org/problem?id=2993 这个题与POJ2996正好反着,但个人认为,比2996好做多了,那些边边框框都挺容易输出的,剩下的注意p别忘了给输进去就行,还有白色的是大 ...

  9. DIV+CSS列表式布局(同意图片的应用)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  10. 李洪强iOS开发之Foundation框架—集合

    Foundation框架—集合 一.NSArray和NSMutableArray (一)NSArray不可变数组 (1)NSArray的基本介绍 NSArray是OC中使用的数组,是面向对象的,以面向 ...