加载AngularJS文件的正确顺序是什么？

Question

我遇到了一个问题,我的AngularJS网页有时无法正确加载.发生这种情况时,相应控制器中的代码不会运行.它很少发生.我怀疑这可能是由于AngularJS文件的加载顺序.也许还有其他可能的原因.如果你能想到,请提醒我.下面是我的代码,显示了html页面的加载顺序;

    <script src="lib/angular/angular.min.js"></script>
    <script src="lib/angular/angular-route.min.js"></script>
    <script src="js/app.js"></script>
    <script src="js/services.js"></script>
    <script src="js/controllers.js"></script>
    <script src="js/filters.js"></script>
    <script src="js/directives.js"></script>        
    <script src="vendor/dialogs.min.js" type="text/javascript"></script>       
    <script src="lib/angular/angular-sanitize.min.js"></script>   
    <script src="vendor/angular-translate.min.js"></script>  
    <link href="vendor/dialogs.css" rel="stylesheet">   

有什么不对的吗？

Answer 1

首次加载角度库:

<script src="lib/angular/angular.min.js"></script>
<script src="lib/angular/angular-route.min.js"></script>
<script src="vendor/dialogs.min.js" type="text/javascript"></script>       
<script src="lib/angular/angular-sanitize.min.js"></script>   
<script src="vendor/angular-translate.min.js"></script>  

之后加载您的控制器,服务,过滤器,指令

<script src="js/services.js"></script>
<script src="js/controllers.js"></script>
<script src="js/filters.js"></script>
<script src="js/directives.js"></script>        

最后,现在您可以加载您的应用程序初始化文件

<script src="js/app.js"></script>

Answer 2

虽然Nitish正确地提到了这个顺序,但是你应该考虑使用一个脚本加载工具,例如require js,因为一旦你有大量的文件要包含,那么库之间的相互依赖就会变得混乱.