AngularJS：文件连接断开模块声明顺序

发布时间：2020-12-17 08:32:23 所属栏目：安全来源：网络整理

导读：我使用grunt连接我的.js文件为我的Angular应用程序。我刚刚通过并整理了代码库，遵循讨论的约定here，具体来说，将我的代码分组为代表功能的小模块。然而，我发现，连接的顺序似乎打破了应用程序，如果一个模块在声明之前被消耗。例如： |-- src/| |-- ap

我使用grunt连接我的.js文件为我的Angular应用程序。

我刚刚通过并整理了代码库，遵循讨论的约定here，具体来说，将我的代码分组为代表功能的小模块。

然而，我发现，连接的顺序似乎打破了应用程序，如果一个模块在声明之前被消耗。

例如：

|-- src/
|   |-- app/
|   |   |-- userProfile/
|   |   |   |   userProfile.js
|   |   |   |-- deposits/
|   |   |   |   |-- depositFormCtrl.js

哪里：

// userProfile.js
var userProfile = angular.module('userProfile',[])

// depositFormCtrl.js
angular.module('userProfile')
    .controller('DepositFormCtrl',function($scope) {...});

当grunt执行连接时，depositFormCtrl.js会出现在userProfile.js之前。这会导致应用程序抛出一个错误，抱怨：

Uncaught Error: No module: userProfile

我看到很多关于使用RequireJS / AMD管理模块的加载顺序的可能性。然而，经常说，这是overkill /不需要，as Angular handles this for you。

例如：Angular团队的Brian Ford mentioned：

My personal take is that RequireJS does too much; the only feature that AngularJS’s DI system is really missing is the async loading.

他还说elsewhere，他不推荐RequireJS与Angular。

我也看到提到使用angular-loader.js，如seed project所示。然而，根据我的理解，(有很少的官方文档)加载程序的目的是解决加载模块的顺序问题，而不是引用之前用过的。

将angular-loader.js添加到我的项目并没有解决问题。

有一个声明，我应该使用，以防止我有错误？

什么是正确的方式声明模块&控制器，使得顺序文件连接不会影响代码在运行时？

我有时使用的一种技术是将声明放在并置文件的开头。我通过将它们放在一个专门的文件，这将是第一个由连接实用程序拾取。

//app/_declarations.js
angular.module('userProfile',[]);

//app/userProfile/userProfile.js
angular.module('userProfile')
   .config(['$routeProvider',function ($router) {...});

//app/userProfile/deposits/depositFormCtrl.js
angular.module('userProfile')
   .controller('DepositFormCtrl',function($scope) {...});

可能不适合所有场景，但设置和理解很简单。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!