6个强大的AngularJS扩展应用
AngularJS现在非常热门,是Google推出的一款非常优秀的前端JS框架。AngularJS最核心的概念是MVC、模块化、自动化双向数据绑定、语义化标签、依赖注入等。目前AngularJS扩展还比较少,本文就向各位分享6个实用强大的AngularJS扩展应用。
1、AngularJS 认证模块 Satellizer
Satellizer是一个端到端的基于 token 的AngularJS认证模块,Satellizer支持Google、Facebook、LinkedIn 和 Twitter 认证体系,并且也提供邮箱和密码的登录方式,另外Satellizer支持 OAuth 1.0 和 2.0 规范,所以你可以更加灵活地扩展认证方法。
下面是Satellizer的使用代码示例:
angular.module('MyApp', ['satellizer']).config(function($authProvider) { $authProvider.facebook({ clientId: '624059410963642', }); $authProvider.google({ clientId: '631036554609-v5hm2amv4pvico3asfi97f54sc51ji4o.apps.googleusercontent.com' }); $authProvider.github({ clientId: '0ba2600b1dbdb756688b' }); $authProvider.linkedin({ clientId: '77cw786yignpzj' }); $authProvider.twitter({ url: '/auth/twitter' }); $authProvider.oauth2({ name: 'foursquare', url: '/auth/foursquare', redirectUri: window.location.origin, clientId: 'MTCEJ3NGW2PNNB31WOSBFDSAD4MTHYVAZ1UKIULXZ2CVFC2K', authorizationEndpoint: 'https://foursquare.com/oauth2/authenticate', }); });
官方地址:https://github.com/sahat/satellizer
2、AngularJS UI 扩展 AngularUI
AngularUI为AngularJS提供了很多UI增强效果,并且提供了IE、jQuery 兼容,以及一些常用 UI 组件。
AngularUI包含以下模块:
- UI-Utils
- UI-Modules
- UI-Alias
- UI-Bootstrap
- NG-Grid
- UI-Router
- IDE Plugins
- GSoC
官方主页:http://angular-ui.github.io/
3、Bootstrap 集成 AngularJS 模块 AngularStrap
AngularStrap可以非常完美地将Bootstrap集成到AngularJS中,AngularStrap包含大部分支持AngularJS指令,所以并不需要依赖其他的样式和脚本。
下面是一个示例:
angular.module(‘myApp’)
.controller(‘DemoCtrl’, function($scope, $modal) {
// Show a basic modal from a controller
var myModal = $modal({title: ‘My Title’, content: ‘My Content’, show: true});// Pre-fetch an external template populated with a custom scope
var myOtherModal = $modal({scope: $scope, template: ‘modal/docs/modal.tpl.demo.html’, show: false});
// Show when some event occurs (use $promise property to ensure the template has been loaded)
$scope.showModal = function() {
myOtherModal.$promise.then(myOtherModal.show);
};
})
官方主页:http://mgcrea.github.io/angular-strap/
4、AngularStrap 实时、多用户应用 GoAngular
GoAngular 可让你轻松使用 AngularJS 和 GoInstant 构建实时、多用户的应用程序。
下面是config.js文件:
window.CONFIG = {connectUrl: 'https://goinstant.net/YOUR_ACCOUNT/YOUR_APP' };
打开一个示例页面:
$ open examples/index.html
5、AngularJS UI 组件 adapt-strap
adapt-strap 是 AngularJS UI 组件和实用工具,是基于 AngularJS 1.2+ 和 bootstrap 3 的。
特性:
- Table Lite - 简单的列表 UI
- Table AJAX - 高级的列表 UI
- Tree Browser - 简单的树形 UI
- Loading Indicators - 简单的指令
- Global configuration - 所有组件都是全局配置使用
- Customizable - 所有组件都是支持高度自定义的
官方主页:https://github.com/Adaptv/adapt-strap
6、AngularJS 的国际化模块 angular-translate
angular-translate 是一个 AngularJS 的模块,用于简化 i18n 和 l10n 应用的便携,实现了延迟加载和多元化。
DEMO示例:
var app = angular.module('at', ['pascalprecht.translate']);app.config(function ($translateProvider) { $translateProvider.translations('en', { TITLE: 'Hello', FOO: 'This is a paragraph.', BUTTON_LANG_EN: 'english', BUTTON_LANG_DE: 'german' }); $translateProvider.translations('de', { TITLE: 'Hallo', FOO: 'Dies ist ein Paragraph.', BUTTON_LANG_EN: 'englisch', BUTTON_LANG_DE: 'deutsch' }); $translateProvider.preferredLanguage('en'); }); app.controller('Ctrl', function ($scope, $translate) { $scope.changeLanguage = function (key) { $translate.use(key); }; });
官方主页:http://angular-translate.github.io/
随着AngularJS的不断流行,会有更多的扩展应用,并大部分都是开源的项目,AngularJS真的非常方便,你不妨也可以试试。
本文链接:http://www.codeceo.com/article/6-angularjs-extension.html
本文作者:码农网 – 小峰
转载于:https://www.cnblogs.com/sxz2008/p/6494809.html
6个强大的AngularJS扩展应用相关推荐
- 一款功能强大,可扩展端到端加密反向Shell的工具
关于Mediator Mediator是一款功能强大的可扩展端到端加密反向Shell,该工具基于新型架构实现,采用Python语言开发,能够帮助广大研究人员通过一台"Mediator&quo ...
- H2O机器学习:一种强大的可扩展的人工智能和深度学习技术
书名:基于H2O的机器学习实用方法:一种强大的可扩展的人工智能和深度学习技术 原书名:Practical Machine Learning with H2O:Powerful, Scalable Te ...
- Z.ExtensionMethods 一个强大的开源扩展库
今天有意的在博客园里面搜索了一下 Z.ExtensionMethods 这个扩展类库,确发现只搜到跟这个真正相关的才两篇博文而已,我都点进去看了一下,也都只是提到而已,没有专门介绍,才引起我写这篇文档 ...
- AngularJS vs. jQuery,看看谁更胜一筹
http://www.apjs.net/ http://docs.angularjs.cn/api/ng/function 本文由PHP100中文网编译,转载请看文末的转载要求,谢谢合作! 除非特别声 ...
- 我的学习网址(未完)
一.AngularJS: 1.AngularJs 实例|菜鸟教程 http://www.runoob.com/angularjs/angularjs-examples.html 2.Angular ...
- 如果我有jQuery背景,那么“ AngularJS中的思考”吗? [关闭]
已关闭 . 这个问题需要更加集中 . 它当前不接受答案. 想改善这个问题吗? 更新问题,使其仅通过编辑此帖子来关注一个问题. 4年前关闭. 已锁定 . 该问题及其答案被锁定,因为该问题是题外话,但具有 ...
- angularjs详解
1 前言 前端技术的发展是如此之快,各种优秀技术.优秀框架的出现简直让人目不暇接,紧跟时代潮流,学习掌握新知识自然是不敢怠慢. AngularJS是google在维护,其在国外已经十分火热,可是国内的 ...
- angularjs框架
1 前言 前端技术的发展是如此之快,各种优秀技术.优秀框架的出现简直让人目不暇接,紧跟时代潮流,学习掌握新知识自然是不敢怠慢. AngularJS是google在维护,其在国外已经十分火热,可是国内的 ...
- 25个超有用的 AngularJS Web 开发工具
AngularJS是为了克服HTML在构建应用上的不足而设计的.HTML是一门很好的为静态文本展示设计的声明式语言,改善了JavaScript. 下面我要说的就是25个超有用的AngularJS工具, ...
- angularjs学习总结 详细教程
本文详细讲解了前言.AngularJS概述.AugularJS特性.功能介绍.功能演示.功能演示.AngularJS进阶.总结七部分,可能会与原文略有不同. 不理解请看原文(尤其是代码部分),本文仅供 ...
最新文章
- python3.8.0shell_Python 3.8.0 正式发布 更新内容
- iOS---Objective-C: +load vs +initialize
- for-each的使用
- php.ini中关于Session的配置
- MybatisPlus 的 MetaObjectHandler 与 @TableLogic
- 安装mysql没有密码_如何在没有密码提示的情况下安装MySQL?
- CCNA学习笔记12-NAT
- html基础之select ,datalist与details的异同
- Sparkline图
- bochs运行xp_bochs安卓最新版下载
- 图像处理之图像分割(一)之活动轮廓模型:Snake算法简单梳理
- TrustedInstaller权限的问题
- php fpm listen.owner,php-fpm配置详解
- ie10不适用计算机,无发安装KB2731771,提示此更新不适用于您的计算机。无法安装ie10,不知道是否跟这个更新无 - Microsoft Community...
- mysql启动报错之[ERROR] Found option without preceding group in config file /etc/my.cnf at line
- win7网络发现启用后找不到网络计算机,win7启用网络发现怎么又关闭了怎么解决...
- 物联卡机卡分离后该怎么处理?教你一招就能解决!
- python1234出栈_Python语句序列“nums=set([1,2,2,3,3,3,4]);print(len(nums))”的运行结果是()。 (2.0分)_学小易找答案...
- Test,Evaluate_gpu 修改,自动跑完你要的epoch
- JAVA大数据的第五十九天——The authenticity of host ‘gree129 (192.168.**.129)‘ can‘t be established.
热门文章
- java ftp 重命名文件_FTP服务器文件重命名
- jenkins内置环境变量
- python为什么难_为什么python这么难
- mysql+mmm+主动模式_Zabbix主动代理模式 + 主动模式agent客户端
- python输入路径读取文件-python获取程序执行文件路径的方法(推荐)
- 【渝粤教育】电大中专测量学 (4)作业 题库
- 怎么加入链接,可以让微信浏览器直接提示跳出另一个浏览器查看
- Java【第六篇】面向对象基础
- ArrayList概述
- Xcode使用小技巧-filter查找功能和查看最近修改的文件