在使用 MVC 多年后,我刚刚开始使用 Angular。我对 js、HMTL 非常熟悉,但在 Angular 世界中还是初学者。
我花了 3 个小时试图找出我的应用出了什么问题。
所以应用程序有 3 个文件
index.html
<body ng-app="perica">
<p>main</p>
{{ tagline }}
<a ng-click="logOut();">Logout</a>
<div ng-view><p>inside</p></div>
</body>
<script type="text/javascript" src="../components/angular/angular.js"></script>
<script type="text/javascript" src="../AgularApp.js"></script>
<script type="text/javascript" src="../controllers/AcountController.js">
AngularApp.js
debugger;
angular.module('perica', ['ngRoute']).config(['$routeProvider','$locationProvider', function ($routeProvider, $locationProvider) {
console.log('in');
debugger;
$routeProvider.when('/test', {
templateUrl: 'views/Account/_Login.html'
})
$locationProvider.html5Mode(true);
}]);
和AccountController.js
var myApp = angular.module('perica', []);
myApp.controller('AcountController', ['$scope', function ($scope) {
$scope.tagline = 'The square root of life is pi!';
}]);
正如您所看到的,这是一个 super 简单的应用程序。
根据所有编码逻辑,我应该首先加载 Angular 核心脚本,然后加载我的 Angular 应用程序,最后加载 AngularControles。
当我运行应用程序时,Chrome 会点击第一个调试器(AngularApp.js 文件内的 angular.module 上方)并直接跳转到 AccountContoler.js,并完全忽略 AngularApp.js 内部定义的内容。
但是 当我反转路径并先放置 AccountController.js,然后放置 AngularApp.js 时,一切正常,没有任何问题
如果有人能阐明这个问题,我将非常感激 谢谢!
最佳答案
通过使用...
var myApp = angular.module('perica', [])
...在您的 AccountController.js
中,您未加载已有的 'perica'
应用程序(在先前加载的 AngularApp.js
中声明):
您正在重新定义perica
应用程序。
引用现有模块的正确方法是使用:
angular.module('perica')
^
no dependency declared
而不是:
angular.module('perica', [])
^
dependencies
一旦您熟悉了它,其背后的逻辑就非常简单:如果您在“加载”模块时声明依赖项,那么您就是在创建该模块。否则,您就是在引用它。
TL;DR:您基本上使用的是 setter
这里两次并且从未真正增强您现有的模块。
这是一个working JSFiddle (link)当您的应用程序运行时。我直接从 Javascript 框架/扩展 菜单加载 AngularJS 并引用外部 JS 资源 angular-route
(取自cdnjs:https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular-route.min.js)。
我基本上只是简单地连接了你的 AngularApp.js
和AccountController.js
内容来模拟一个接一个地加载它们。
请注意,您还必须声明控制您的 View 的 Controller :我冒昧地增强了您的<body ng-app="perica">
元素如下:
<body ng-app="perica" ng-controller="AcountController">
关于javascript - Angular - 脚本加载顺序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34882574/