gpt4 book ai didi

javascript - AngularJS - 参数 'MenuCtrl' 不是函数,未定义

转载 作者:行者123 更新时间:2023-11-30 12:26:09 25 4
gpt4 key购买 nike

我正在尝试在我的网络应用程序中使用 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/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com