AngularJS压缩JS技巧分析


Posted in Javascript onNovember 08, 2016

本文实例讲述了AngularJS压缩JS的操作技巧。分享给大家供大家参考,具体如下:

大多数web项目在发布时候都会对js代码进行压缩,目的是为了减少js文件的大小,节省一点流量。

它的原理很简单,就是对参数及部分变量名和函数进行重命名。

但是这种工作方式在AngularJS的应用中会有例外。

由于AngularJS的依赖注入是根据参数名进行注入的,显然,对参数进行重命名会破坏这个机制。

如果不进行特殊处理,进行压缩(minify)之后,在执行时将会出现这样的错误

Unknow provider: aProvider<-a

对于这种错误的官方解释是:找不到依赖的服务

也就是说这种依赖注入会出现错误。

好在AngularJS内置了一种标准机制来处理这个问题.

最简单也最常见的方式就是用数组代替函数。如:

.controller('RegisterCtrl', ['$scope', '$interval', '$timeout', function ($scope, $interval, $timeout) {
  //do something
}]);

数组的最后一个元素始终是一个函数,而前面几个参数都是字符串,和这个函数中的参数一一对应。

另一种形式便是所谓的Annotation方式。

var objCtrl = function($scope, $timeout, $interval){
  // do something
}
//给objCtrl函数增加一个$inject属性,它是一个数组,定义了需要被注入的对象
objCtrl.$inject = ['$scope', '$interval', '$timeout'];

这里的依赖注入形式不仅限于Controller,一切需要DI(依赖注入的directive、factory、services等)都可以采用这两种方式。

希望本文所述对大家AngularJS程序设计有所帮助。

Javascript 相关文章推荐
Javascript中的常见排序算法
Mar 27 Javascript
Dom 学习总结以及实例的使用介绍
Apr 24 Javascript
JS控制图片翻转示例代码(兼容firefox,ie,chrome)
Dec 19 Javascript
JS之Date对象和获取系统当前时间详解
Jan 13 Javascript
利用jquery.qrcode在页面上生成二维码且支持中文
Feb 12 Javascript
一个JavaScript防止表单重复提交的实例
Oct 21 Javascript
JavaScript数组去重的五种方法
Nov 05 Javascript
原生JavaScript实现异步多文件上传
Dec 02 Javascript
深入理解JS中的substr和substring
Apr 26 Javascript
微信小程序如何获取用户信息
Jan 26 Javascript
setTimeout与setInterval的区别浅析
Mar 23 Javascript
解决微信小程序云开发中获取数据库的内容为空的方法
May 15 Javascript
jQuery的Read()方法代替原生JS详解
Nov 08 #Javascript
bootstrap fileinput完整实例分享
Nov 08 #Javascript
AngularJS动态加载模块和依赖的方法分析
Nov 08 #Javascript
JS文件上传神器bootstrap fileinput详解
Jan 28 #Javascript
Javascript数组循环遍历之forEach详解
Nov 07 #Javascript
关于webuploader插件使用过程遇到的小问题
Nov 07 #Javascript
jQuery webuploader分片上传大文件
Nov 07 #Javascript
You might like
PHP VS ASP
2006/10/09 PHP
php调用dll的实例操作动画与代码分享
2012/08/14 PHP
qq登录,新浪微博登录接口申请过程中遇到的问题
2014/07/22 PHP
PHP数组遍历的几种常见方式总结
2019/02/15 PHP
PHP架构及原理知识点详解
2019/12/22 PHP
看了就知道什么是JSON
2007/12/09 Javascript
JavaScript 构造函数 面相对象学习必备知识
2010/06/09 Javascript
JavaScript高级程序设计 DOM学习笔记
2011/09/10 Javascript
JQuery加载图片自适应固定大小的DIV
2013/09/12 Javascript
Javascript之this关键字深入解析
2013/11/12 Javascript
Javascript数组操作函数总结
2015/02/05 Javascript
JavaScript使用setTimeout实现延迟弹出警告框的方法
2015/04/07 Javascript
Javascript将双字节字符转换成单字节字符并计算长度
2016/06/22 Javascript
jquery封装插件时匿名函数形参和实参的写法解释
2017/02/14 Javascript
jQuery实现鼠标响应式淘宝动画效果示例
2018/02/13 jQuery
JavaScript数值类型知识汇总
2019/11/17 Javascript
webpack.DefinePlugin与cross-env区别详解
2020/02/23 Javascript
Python标准库与第三方库详解
2014/07/22 Python
Python使用MySQLdb for Python操作数据库教程
2014/10/11 Python
使用IronPython把Python脚本集成到.NET程序中的教程
2015/03/31 Python
Python Web框架Tornado运行和部署
2020/10/19 Python
python实现读取excel写入mysql的小工具详解
2017/11/20 Python
python3学习笔记之多进程分布式小例子
2018/02/13 Python
python版飞机大战代码分享
2018/11/20 Python
python中sort和sorted排序的实例方法
2019/08/26 Python
提升python处理速度原理及方法实例
2019/12/25 Python
使用Python串口实时显示数据并绘图的例子
2019/12/26 Python
python实现四人制扑克牌游戏
2020/04/22 Python
python将字典内容写入json文件的实例代码
2020/08/12 Python
GANT英国官方网上商店:甘特衬衫
2018/02/06 全球购物
Falconeri美国官网:由羊绒和羊毛制成的针织服装
2018/04/08 全球购物
2014年班组建设工作总结
2014/12/01 职场文书
欠款起诉书范文
2015/05/19 职场文书
城南旧事电影观后感
2015/06/16 职场文书
详解TS数字分隔符和更严格的类属性检查
2021/05/06 Javascript
SQL Server一个字符串拆分多行显示或者多行数据合并成一个字符串
2022/05/25 SQL Server