未捕获的ReferenceError：在Angularjs中未定义app
[英]Uncaught ReferenceError: app is not defined in Angularjs
问题描述
I got this error. 
我收到了这个错误。 I looked through the answers posted previously but still I have the same problem. 我查看了之前发布的答案但仍然遇到了同样的问题。
index.html 的index.html
<html lang="en" ng-app="customersApp">
<head>
<link rel="shortcut icon" href="img/favicon.html">
<title>Vizavoo</title>
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap-reset.css" rel="stylesheet">
<link href="assets/font-awesome/css/font-awesome.css" rel="stylesheet" />
<!--external css-->
<link href="css/slidebars.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="css/style.css" rel="stylesheet">
<link href="css/style-responsive.css" rel="stylesheet" />
</head>
<body>
<div ng-view></div>
<!-- js placed at the end of the document so the pages load faster -->
<script src="scripts/angular.js"></script>
<script src="scripts/angular-route.js"></script>
<script src="app/app.js"></script>
<script src="app/controllers/loginController.js"> </script>
<script src="js/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
<!-- Mirrored from thevectorlab.net/flatlab/login.html by HTTrack Website Copier/3.x [XR&CO'2014], Mon, 08 Dec 2014 06:09:06 GMT -->
</html>
app.js app.js
(function(){
var app= angular.module('customersApp',['ngRoute']);
app.config(['$routeProvider',
function ($routeProvider) {
$routeProvider.
when('/login', {
title: 'Login',
controller: 'loginController',
templateUrl: 'app/views/loginuser.html'
})
.when('/logout', {
title: 'Logout',
templateUrl: 'partials/login.html',
controller: 'loginController'
})
.when('/dashboard', {
title: 'Dashboard',
templateUrl: 'app/views/dynamic_table.html',
controller: 'loginController'
})
.when('/signup', {
title: 'Signup',
templateUrl: 'app/views/registration.html',
controller: 'loginController'
})
.otherwise({
redirectTo: '/login'
});
}]);
}());
loginController.js loginController.js
app.controller('loginController', function ($scope,$http, Data) {
//initially set those objects to null to avoid undefined error
$scope.login = {};
$scope.signup = {};
$scope.doLogin = function (customer) {
$.post("http://dev.miniluxe.com:4002/email_login",
{
email : $scope.login.email,
password : $scope.login.password
},
function(data,status){
data = JSON.parse(data);
console.log(data);
if(data.log==1)
{
// window.location.href = "dashboard";
$location.path('dashboard');
}
else
{
alert("wrong username and password");
}
});
};
$scope.logout = function () {
Data.get('logout').then(function (results) {
Data.toast(results);
$location.path('login');
});
}
app.filter('startFrom', function() {
return function(input, start) {
if(input) {
start = +start; //parse to int
return input.slice(start);
}
return [];
}
});
});
Please check the code and tell me where I am making a mistake. 请检查代码并告诉我我在哪里犯了错误。
5 个解决方案
解决方案1
9 已采纳 2014-12-31 09:14:11
This is a good lesson on scope. 这是关于范围的一个很好的教训。 Wrapping things in anonymous functions ( function(){...}()); 在匿名函数中包装（ function(){...}()); ) will make variables declared inside that function invisible to things outside the function. ）将使该函数内部声明的变量对函数外部的事物不可见。 I wont go over all the javascript scope stuff in this response because it is well documented on many other questions but essentially this is your problem; 我不会在这个回复中查看所有javascript范围的内容，因为它在许多其他问题上有很好的文档，但实质上这是你的问题;
(function(){
var hello = "world";
}());
console.log(hello); // no good, hello is not declared in this scope
In short remove the anonymous function that's in your app.js or declare the app variable outside the function. 简而言之，删除app.js中的匿名函数或在函数外声明app变量。
解决方案2
8 2014-12-31 09:18:32
It looks like all other answers are from people with no knowledge of Angular JS, and only of Javascript. 看起来所有其他答案都来自不了解Angular JS且只有Javascript知识的人。 They all give the same erroneous answer, which may cause the code to work, but introduce a bad practice. 他们都给出了相同的错误答案，这可能导致代码工作，但引入了一个不好的做法。
Wrapping your code in an anonymous function is fine! 将代码包装在匿名函数中就好了！
This is not the problem. 这不是问题。 The problem is that you put your controller in a separate file, but forgot to put it in a separate module as well. 问题是你将控制器放在一个单独的文件中，但是忘了把它放在一个单独的模块中。
loginController.js loginController.js
angular.module('customersApp.loginController',[])
.controller('loginController', function ($scope,$http, Data) {
...
});
app.js app.js
var app= angular.module('customersApp',['ngRoute','customersApp.loginController']);
This answer is backed up by the angular seed project that is also referred to in the official angular docs: https://github.com/angular/angular-seed 这个答案由角度种子项目支持，该项目在官方角度文档中也有提及： https ： //github.com/angular/angular-seed
解决方案3
4 2017-02-09 21:57:12
Had the same error. 有同样的错误。 In my case it was the order of the javascript files. 在我的情况下，它是javascript文件的顺序。
I had to make sure app.js was declared before the service.js file (the file that had a reference to app in it). 我必须确保在service.js文件（其中包含对app的引用的文件）之前声明app.js。
<script src="app.js"></script>
<script src="/Scripts/Service.js"></script>
In addition, this error ("app is not defined") could be caused by a syntax error in your javascript code, so check your javascript code for syntax errors, if there is a "Uncaught SyntaxError" paired up with it. 此外，此错误（“app未定义”）可能是由您的javascript代码中的语法错误引起的，因此请检查您的javascript代码是否存在语法错误，如果存在与其配对的“Uncaught SyntaxError”。
解决方案4
2 2014-12-31 09:11:37
your app is defined inside anonymous function , so app has the scope within it. 您的应用程序是在匿名函数中定义的，因此应用程序具有其中的范围。 try creating a global app variable. 尝试创建一个全局app变量。
(function(){
app= angular.module('customersApp',['ngRoute']);
app.config(['$routeProvider',
function ($routeProvider) {
$routeProvider.
when('/login', {
title: 'Login',
controller: 'loginController',
templateUrl: 'app/views/loginuser.html'
})
.when('/logout', {
title: 'Logout',
templateUrl: 'partials/login.html',
controller: 'loginController'
})
.when('/dashboard', {
title: 'Dashboard',
templateUrl: 'app/views/dynamic_table.html',
controller: 'loginController'
})
.when('/signup', {
title: 'Signup',
templateUrl: 'app/views/registration.html',
controller: 'loginController'
})
.otherwise({
redirectTo: '/login'
});
}]);
}());
解决方案5
2 2014-12-31 09:18:24
Remove the anonymous function from app.js like: 从app.js中删除匿名函数，如：
var app= angular.module('customersApp',['ngRoute']);
app.config(['$routeProvider',
function ($routeProvider) {
// rest of the code
}]);
And also move your startFrom filter registration code out of the controller block. 并且还将startFrom过滤器注册码移出控制器块。 One last thing that your controller is accepting an dependency injection at very last: Data which is not defined, so remove that also. 最后一件事是你的控制器在最后接受依赖注入：未定义的Data ，所以也删除它。
Hope this helps! 希望这可以帮助！
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.