我正在尝试使用Django进行角色工作。我非常难以使用Django和Angular，但现在我又遇到了一个错误。每次加载它时，都会出现以下错误。
Error: [ng:areq] Argument 'GreetingController' is not a function, got undefined
我在堆栈溢出上尝试了很多其他解决方案链接，但没有解决我的问题。
以下是我保存为app.js的角度代码段。
var app = angular.module('ABC',['ngRoute', 'ui.bootstrap']).
controller('GreetingController', ['$scope', function($scope) {
$scope.greeting = 'Hola!';
}]);
app.config(function($interpolateProvider, $routeProvider){
//$interpolateProvider.startSymbol('[[');
//$interpolateProvider.endSymbol(']]');
$routeProvider.when('/about', {
templateUrl: 'views/about.html'
}).when('/login',{
templateUrl: '/views/login/login.html'
}).otherwise({
redirectTo: '/about'
});
});
和我的HTML代码段
{% load staticfiles %}
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="/assets/js/bower_components/bootstrap/dist/css/bootstrap.css">
<link rel="stylesheet" href="/assets/style/main.css">
<link rel="stylesheet" href="/assets/style/container.css">
<link rel="stylesheet" href="/assets/style/button.css">
<script src="/assets/js/bower_components/jquery/dist/jquery.js"></script>
<script src="/assets/js/bower_components/bootstrap/dist/js/bootstrap.js"></script>
<script src="/assets/js/bower_components/angular/angular.js"></script>
<script src="/assets/js/bower_components/angular-route/angular-route.js"></script>
<script src="/assets/js/bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
<script src="/app.js"></script>
<script src="/views/login/login.js"></script>
</head>
<body ng-app="ABC">
<div class="container-fluid">
<nav class="navbar navbar-default navbar-fixed-top navbar-inverse">
<ul class="nav navbar-nav">
<li><a href="#home">Home</a></li>
<li><a href="#login">Login</a></li>
<li><a href="#signup">Sign Up</a></li>
</ul>
</nav>
</div>
<div id="wrap" ng-controller="GreetingController">
<div class="container-fluid" id="main">
<ng-view></ng-view>
</div>
</div>
</body>
</html>
如果有人能够对此进行调查并让我知道解决方案，我将非常感激。
编辑：请找到源代码的链接。
https://github.com/mikhilraj/bucky
提前致谢。
答案 0 :(得分：0)
您的脚本未正确执行。您可以在底部移动<script src="/app.js"></script>，以便在DOM中呈现HTML元素后执行脚本。
{% load staticfiles %}
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="/assets/js/bower_components/bootstrap/dist/css/bootstrap.css">
<link rel="stylesheet" href="/assets/style/main.css">
<link rel="stylesheet" href="/assets/style/container.css">
<link rel="stylesheet" href="/assets/style/button.css">
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="/assets/js/bower_components/bootstrap/dist/js/bootstrap.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-route.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.14.3/ui-bootstrap-tpls.js"></script>
</head>
<body ng-app="ABC">
<div class="container-fluid">
<nav class="navbar navbar-default navbar-fixed-top navbar-inverse">
<ul class="nav navbar-nav">
<li><a href="#home">Home</a></li>
<li><a href="#login">Login</a></li>
<li><a href="#signup">Sign Up</a></li>
</ul>
</nav>
</div>
<div id="wrap" ng-controller="GreetingController">
<div class="container-fluid" id="main">
<ng-view></ng-view>
</div>
</div>
</body>
</html>
<script>
var app = angular.module('ABC',['ngRoute', 'ui.bootstrap']);
app.controller('GreetingController', ['$scope', function($scope) {
$scope.greeting = 'Hola!';
}]);
app.config(function($interpolateProvider, $routeProvider){
//$interpolateProvider.startSymbol('[[');
//$interpolateProvider.endSymbol(']]');
$routeProvider.when('/about', {
templateUrl: 'views/about.html'
}).when('/login',{
templateUrl: '/views/login/login.html'
}).otherwise({
redirectTo: '/about'
});
});
</script>
<!--script src="/app.js"></script-->
<script src="/views/login/login.js"></script>
答案 1 :(得分：0)
更改了一些东西。只需添加自举等东西。 我还在routeProvider中更改了文件的URL。请查看plunker。
HTML：
<!DOCTYPE html>
<html ng-app="plunker">
<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<script>document.write('<base href="' + document.location + '" />');</script>
<link rel="stylesheet" href="style.css" />
<script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.8/angular.js" data-semver="1.4.8"></script>
<script src="https://code.angularjs.org/1.4.8/angular-route.min.js"></script>
<script src="app.js"></script>
</head>
<body>
<div class="container-fluid">
<nav class="navbar navbar-default navbar-fixed-top navbar-inverse">
<ul class="nav navbar-nav">
<li><a href="#home">Home</a></li>
<li><a href="#login">Login</a></li>
<li><a href="#signup">Sign Up</a></li>
</ul>
</nav>
</div>
<div id="wrap" ng-controller="GreetingController">
<div class="container-fluid" id="main">
<ng-view></ng-view>
</div>
</div>
</body>
</html>
角色代码：
var app = angular.module('plunker', ['ngRoute']);
app.controller('GreetingController', function($scope) {
$scope.greeting = 'Hola!';
});
app.config(['$routeProvider', function($routeProvider) {
//$interpolateProvider.startSymbol('[[');
//$interpolateProvider.endSymbol(']]');
$routeProvider.when('/about', {
templateUrl: 'about.html'
}).when('/login',{
templateUrl: 'login.html'
}).otherwise({
redirectTo: '/about'
});
}]);