在AngularJS中，通过resolve属性可以预先加载依赖项，确保它们在控制器被实例化之前可用。但是，在压缩代码时，这可能会导致一些问题，因为AngularJS无法正确地解析参数名称。本文将介绍如何在使用resolve和控制器时编写可压缩的代码。
问题描述
在使用resolve和控制器时，常见的代码如下所示：
-- -------------------- ---- -------
-----------------------
--------------------- ---------------- ------------ -
-- ---
--
-------------------------------- -
------------------------ -
------------ ---------------------
----------- ---------
-------- -
------------ --------------- -
------ ----------------------------
-
-
---
---当我们压缩这段代码时，AngularJS无法正确解析控制器函数中的参数名称，因为它们已被缩短为单个字符，例如$scope可能变成s。然而，resolve函数中的参数名称没有被压缩，并且仍然是全名，如$http。
这意味着我们需要在控制器和resolve函数中使用相同的参数名称，以便正确压缩。
解决方案
为了解决这个问题，我们可以使用两种方法：使用字符串注入或者使用ng-annotate。
方法一：使用字符串注入
通过使用字符串注入，控制器函数中的参数名称将不再与依赖项函数中的参数名称匹配。因此，我们可以在resolve函数中使用全名而不必担心压缩后出现错误。
-- -------------------- ---- -------
-----------------------
--------------------- ---------- -------------- ---------------- ------------ -
-- ---
---
-------------------------- ------------------------ -
------------------------ -
------------ ---------------------
----------- ---------
-------- -
------------ --------- --------------- -
------ ----------------------------
--
-
---
----这里使用了数组语法来注入参数，其中每个元素表示一个参数名称和其对应的依赖项名称。在这种情况下，我们可以使用任何参数名称而不会影响代码的压缩。
方法二：使用ng-annotate
ng-annotate是一个可自动添加依赖注入数组语法的工具，它可以让我们轻松地编写可压缩的代码。
首先，需要安装ng-annotate：
npm install --save-dev ng-annotate
然后，在构建流程中使用ng-annotate：
-- -------------------- ---- -------
--- ---- - ----------------
--- ---------- - -----------------------
--- ------ - -----------------------
------------------ ---------- -
------ ------------------
-------------------
---------------
-------------------------
---这里使用了gulp作为构建工具，但是ng-annotate也可以用于其他构建工具或命令行环境中。
使用ng-annotate后，我们可以将原始代码写成以下形式：
-- -------------------- ---- -------
-----------------------
--------------------- ---------------- ------------ -
-- ---
--
-------------------------------- -
------------------------ -
------------ ---------------------
----------- ---------
-------- -
------------ --------------- -
------ ----------------------------
-
-
---
---然后ng-annotate会自动添加依赖注入数组语法，生成可以压缩的代码。
总结
使用resolve和控制器时，正确压缩代码是非常重要的。在本文中，我们
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/26643