我已经将Angular从1.0x升级到版本1.3x，现在我得到了一个非常讨厌的bug：
错误：[ng：areq] Argument＆＃39; LayoutController＆＃39;得到了，不是一个功能 未定义
也许有人可以帮助发现问题？我已阅读了大量SO帖子，似乎无法理解为什么它无法找到问题。
的index.html
<!doctype html>
<html lang="en" ng-app="AngularFlask">
<head>
<meta charset="utf-8">
<title>Yada</title>
<link rel="stylesheet" href="/static/css/bootstrap.css">
<link rel="stylesheet" href="/static/css/bootstrap-responsive.css">
<link rel="stylesheet" href="/static/css/bootstrap-theme.css">
<link rel="stylesheet" href="/static/css/main.css">
<script src="/static/lib/angular/angular.js"></script>
<script src="/static/lib/angular-resource/angular-resource.js"></script>
<script src="/static/lib/angular-route/angular-route.js"></script>
<script src="/static/js/app.js"></script>
<script src="/static/js/controllers.js"></script>
<script src="/static/js/services.js"></script>
<script src="/static/js/directives.js"></script>
<script src="/static/lib/jquery/dist/jquery.min.js"></script>
<script src="/static/lib/bootstrap/dist/js/bootstrap.min.js"></script>
</head>
<body>
<nav class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">YADA (yet another dating app)</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Menu<span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<li><a href="#">Profile</a></li>
<li><a href="#">Matches</a></li>
<li><a href="#">Vouches</a></li>
<li class="divider"></li>
<li><a href="#">Contact Us</a></li>
</ul>
</li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div ng-controller="LayoutController" ng-init='init({{ instagram_url|tojson }})'/>
<div class="container page">
<div id="content" class="container main" ng-view>
</div>
<hr>
<footer id="footer" class="footer">
<div class="footer-left">
<a href="/about">About</a> |
<a href="/">Home</a>
</div>
<div class="footer-right">
<span>© 2014 Indigo Panda Labs Inc.</span>
</div>
</footer>
</div>
</body>
</html>
app.js
var app = angular.module('AngularFlask', ['angularFlaskServices', 'ngRoute'])
.config(['$routeProvider', '$locationProvider',
function($routeProvider, $locationProvider) {
$routeProvider
.when('/', {
templateUrl: 'static/partials/landing.html',
controller: IndexController
})
.when('/about', {
templateUrl: 'static/partials/about.html',
controller: AboutController
})
.when('/instagram_oauth_callback', {
templateUrl: 'static/partials/profile.html',
controller: ProfileController
})
.when('/likes', {
templateUrl: 'static/partials/likes.html',
controller: LikesController
})
.when('/basicinfo', {
templateUrl: 'static/partials/basicinfo.html',
controller: BasicInfoController
})
.when('/workandschool', {
templateUrl: 'static/partials/workandschool.html',
controller: WorkAndSchoolController
})
// .otherwise({
// redirectTo: '/'
// })
;
$locationProvider.html5Mode({
enabled: true,
requireBase: false
});
}])
;
app.config(['$interpolateProvider', function($interpolateProvider) {
$interpolateProvider.startSymbol('{[');
$interpolateProvider.endSymbol(']}');
}]);
/* Controllers */
//Tab order:
// landing
// instagram callback
// pics
// basic info
// work and school
// likes
// request vouches
// view profile
function LayoutController($scope) {
$scope.init = function(instagram_url) {
$scope.instagram_url = instagram_url;
}
}
function IndexController($scope, $http) {
}
function WorkAndSchoolController($scope) {
$scope.isSelectedWorkEducationInputType = false;
$scope.connectManually = function() {
$scope.isSelectedWorkEducationInputType = true;
};
$scope.connectToLinkedIn = function() {
console.log("stub to connect to linkedin");
$scope.isSelectedWorkEducationInputType = true;
}
$scope.goToLikes
}
function LikesController($scope, $window) {
console.log("hi")
$scope.likes = [{"id" : 1,
"caption" : "Hot air balooning",
"isSelected" : false},
{"id" : 2,
"caption" : "Skiing",
"isSelected" : false},
{"id" : 3,
"caption" : "Wine tasting",
"isSelected" : false},
{"id" : 4,
"caption" : "Kiteboarding",
"isSelected" : false},
{"id" : 5,
"caption" : "Bar hopping",
"isSelected" : false},
{"id" : 6,
"caption" : "Bacon",
"isSelected" : false},
{"id" : 7,
"caption" : "Backpacking",
"isSelected" : false},
{"id" : 8,
"caption" : "Gastro pubs",
"isSelected" : false},
{"id" : 9,
"caption" : "Gossip Girl",
"isSelected" : false}]
$scope.isError = false;
$scope.goToWorkAndSchool = function() {
if ($scope.myForm.$valid == true) {
console.log("valid form");
console.log("")
$window.location.href = "/workandschool"
} else {
console.log("invalid form");
$scope.error_text = "Error, all fields are required!"
$scope.isError = true;
}
}
}
function LandingController($scope, $window) {
$scope.instagramLogin = function () {
$window.location.href = $scope.instagram_url
};
}
function BasicInfoController($scope, $window) {
$scope.isError = false;
$scope.goToLikes = function() {
if ($scope.myForm.$valid == true) {
console.log("valid form");
console.log("")
$window.location.href = "/likes"
} else {
console.log("invalid form");
$scope.error_text = "Error, all fields are required!"
$scope.isError = true;
}
}
}
function AboutController($scope) {
}
function ProfileController($scope, $http, $window) {
$http.get('api/pic/').
success(function(data, status, headers, config) {
$scope.pics = data;
console.log("loaded images")
}).
error(function(data, status, headers, config) {
// log error
});
$scope.selectedImages = [];
$scope.clickImage = function(index, url) {
if (index in $scope.selectedImages) {
delete $scope.selectedImages[index]
} else {
$scope.selectedImages[index] = url;
}
}
$scope.getSelectedImage = function(imageNum) {
return $scope.selectedImages[Object.keys($scope.selectedImages)[imageNum]]
}
$scope.goToBasicInfo = function() { $window.location.href = "/basicinfo" };
}
答案 0 :(得分：4)
在Angular.JS 1.3中，您必须使用angular.module("whatever").controller("controllerName", TheFunction)语法定义控制器。您将不得不为每个函数添加一个类似的行（如果您希望保持定义不变，否则，只需将它们包装在controller()个调用中）。
这是一篇关于这个问题的帖子，当它首次在Angular 1.3测试版之一中被引入时：
答案 1 :(得分：3)
Angular moved away。要声明控制器，请使用：
app.controller("LayoutController", LayoutController);
或者，如果您想缩小，请直接识别依赖项：
备选方案1：
app.controller("LayoutController", ["$scope", LayoutController]);
备选方案2：
LayoutController.$inject = ["$scope"];
app.controller("LayoutController", LayoutController);