Error: [ng:areq] Argument 'GreetingController' is not a function, got undefined
Error: [ng:areq] Argument 'GreetingController' is not a function, got undefined
我正在尝试让 angular 与 Django 一起工作。我非常困难地让它与 Django 和 Angular 一起工作,但现在我又遇到了一个错误。每次加载它时,我都会收到以下错误。
Error: [ng:areq] Argument 'GreetingController' is not a function, got undefined
关于堆栈溢出,我尝试了很多其他解决方案 link,但是 none 解决了我的问题。
以下是我的 angular 片段保存为 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>
如果有人能调查一下并告诉我解决方案,我将不胜感激。
编辑:请找到 link 源代码。
https://github.com/mikhilraj/bucky
提前致谢。
您的脚本未正确执行。您能否将 <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>
更改了一些 things.Just 添加剩余内容,例如 bootstrap 等。
我还为 routeProvider.Just 中的文件更改了 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>
Angular代码:
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'
});
}]);
我正在尝试让 angular 与 Django 一起工作。我非常困难地让它与 Django 和 Angular 一起工作,但现在我又遇到了一个错误。每次加载它时,我都会收到以下错误。
Error: [ng:areq] Argument 'GreetingController' is not a function, got undefined
关于堆栈溢出,我尝试了很多其他解决方案 link,但是 none 解决了我的问题。
以下是我的 angular 片段保存为 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>
如果有人能调查一下并告诉我解决方案,我将不胜感激。
编辑:请找到 link 源代码。
https://github.com/mikhilraj/bucky
提前致谢。
您的脚本未正确执行。您能否将 <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>
更改了一些 things.Just 添加剩余内容,例如 bootstrap 等。 我还为 routeProvider.Just 中的文件更改了 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>
Angular代码:
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'
});
}]);