我知道这是一个常见问题,但我无法通过阅读之前提出的问题找到解决方案.
我实际上得到了两个错误,但第一个是关于角度无法找到我的控制器.
http://errors.angularjs.org/1.4.2/ $ injector/nomod?p0 = myApp.controllers
我的目录结构如下所示:
.
??? static
??? index.html
??? js
? ??? app.js
? ??? controllers.js
??? lib
? ??? angular-ui-router.min.js
??? partials
??? view1.html
??? view2.html
Run Code Online (Sandbox Code Playgroud)
我的索引文件如下所示:
<html ng-app="myApp">
<head>
<meta charset="UTF-8">
<title>Hello AngularJS</title>
</head>
<body>
<div ui-view></div>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.2/angular.min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.2/angular-route.min.js"></script>
<script type="text/javascript" src="lib/angular-ui-router.min.js"></script>
<script type="text/javascript" src="js/controllers.js"></script>
<script type="text/javascript" src="js/app.js"></script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
我的app.js文件如下所示:
(function(angular) {
var app = angular.module('myApp', ['ui.router', 'myApp.controllers']);
app.config(function($stateProvider) {
$stateProvider.state('view1', {
url: '/view1',
templateUrl: 'partials/view1.html',
controller: 'View1Controller'
}).state('view2', {
url: '/view2',
templateUrl: 'partials/view2.html',
controller: 'View2Controller'
});
}).run(function($state) {
$state.go('view2');
});
})(angular);
Run Code Online (Sandbox Code Playgroud)
我的controller.js文件如下所示:
(function(angular) {
var app = angular.module('myApp.controllers');
app.controller('View1Controller', function($scope) {
$scope.data = 'my view 1';
});
app.controller('View2Controller', function($scope) {
$scope.data = 'my view 2';
});
})(angular);
Run Code Online (Sandbox Code Playgroud)
也是第二个可能相关的错误.
如上所述,angular无法找到我的控制器.有没有人知道我做错了什么?如果我需要粘贴更多代码,请告诉我.
我已经在github上共享了代码,以防有人发现它更容易处理.
https://github.com/tonsV2/angular-ui.route/tree/master/src/main/resources/static
角度angular.module()是一个二传手和一个吸气剂.根据angular.module文件(通过@ DanAtkinson的评论):
传递一个参数将检索现有的angular.Module,而传递多个参数会创建一个新的angular.Module.
消气
var app = angular.module('myApp.controllers'); 使用模块作为getter.
它失败,因为myApp.controllers尚未创建模块.
二传手
要将它用作setter,请将其更改为
var app = angular.module('myApp.controllers', []); // note the []
Run Code Online (Sandbox Code Playgroud)