我正在尝试在我的网络应用程序中使用 AngularJS，因此动态创建一个菜单，然后根据选择填充页面。我已经创建了所有需要的组件，但是似乎因为我拆分了我的 Controller ，所以我收到了以下错误。有什么想法吗？
Error: [ng:areq] http://errors.angularjs.org/1.3.15/ng/areq?p0=MenuCtrl&p1=not%20a%20function%2C%20got%20undefined
我的代码如下:
index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" ng-app="myWebApp">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="user-scalable=yes, width=device-width, target-densitySpi=device-dpi, initial-scal=1.0" />
<link href="css/MainStyles.css" rel="stylesheet" type="text/css" media="screen">
<!-- Jquery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js" type="text/javascript"></script>
<!-- AngularJS -->
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-route.min.js" type="text/javascript"></script>
<!-- AngularJS Controllers -->
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="js/controllers/home.js"></script>
<title>
Page Title
</title>
</head>
<body>
<div id="menu_bar" ng-controller="MenuCtrl">
<ul>
<li ng-repeat="menuItem in menuItems">
<a href="{{menuItem.path}}">{{menuItem.name}}</a>
</li>
</ul>
</div>
<div id="page_content">
<div ng-view></div>
</div>
</body>
js/app.js
var myWebApp = angular.module('myWebApp', [
'ngRoute',
'myWebAppControllers'
]);
myWebApp.config(['$routeProvider',
function($routeProvider) {
$routeProvider.
when('/', {
redirectTo: '/home'
}).
when('/home', {
templateUrl: '/partials/home.html',
controller: 'HomeCtrl'
}).
otherwise({
templateUrl: '/partials/404.html',
});
}]);
js/controllers.js
var myWebAppControllers = angular.module('myWebAppControllers', []);
myWebAppControllers.controller('MenuCtrl', function ($scope, $location) {
$scope.menuItems = [
{
'name': 'Home',
'path': '#/home'
}
];
});
js/controllers/home.js
var myWebAppControllers = angular.module('myWebAppControllers', []);
myWebAppControllers.controller('HomeCtrl', function ($scope, $location) {
$scope.title = "Home"
});
最佳答案
您定义了同一个模块两次(并且覆盖了第一个模块)，一次在 controllers.js 中，另一次在 controllers/home.js 中。如果你想让两个 Controller 都在同一个模块下，你需要用
var myWebAppControllers = angular.module('myWebAppControllers', []);
而在其他地方只检索它:
var myWebAppControllers = angular.module('myWebAppControllers');
关于javascript - AngularJS - 参数 'MenuCtrl' 不是函数，未定义，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29329048/