Mic*_*Bil 3 javascript angularjs
After running AngularJS app in by NetBeans error mentioned in title appears. I can't see any points where stack is overloaded, as you see I only initialize two variables for login form handling (i'm at the start of my AngularJS adventure). Can it be some hardware issue or I'm making some unconscious mistake here?
error :
RangeError: Maximum call stack size exceeded
at c (public_html/bower_components/angular/angular.min.js:115:232)
at http://localhost:8383/LoginJS/bower_components/angular/angular.min.js:115:506
at q (public_html/bower_components/angular/angular.min.js:7:355)
at Object.error (public_html/bower_components/angular/angular.min.js:115:475)
at http://localhost:8383/LoginJS/bower_components/angular/angular.min.js:89:12
at ra (public_html/bower_components/angular/angular.min.js:69:475)
at xa (public_html/bower_components/angular/angular.min.js:58:270)
at xa (public_html/bower_components/angular/angular.min.js:58:402)
at ba (public_html/bower_components/angular/angular.min.js:56:264)
at A.link (public_html/bower_components/angular-route/angular-route.min.js:7:224) (13:52:05:371 | error)
app.js
angular.module('myapp', ['ngRoute']).config(function($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'index.html'
})
.when('/dashboard', {
templateUrl: 'dashboard.html'
})
.otherwise(({
redirectTo: '/'
}));
});
loginCtrl.js
angular.module('myapp').controller('loginCtrl', function($scope, $location) {
$scope.submit = function() {
var username = $scope.username;
var password = $scope.password;
if($scope.username == 'admin' && $scope.password == 'admin') {
$location.path('/dashboard');
}
};
})
index.html
<html>
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="bower_components/angular/angular.min.js" type="text/javascript"></script>
<script src="bower_components/angular-route/angular-route.min.js" type="text/javascript"></script>
<script src="app.js" type="text/javascript"></script>
<script src="scripts/controllers/loginCtrl.js" type="text/javascript"></script>
</head>
<body ng-app="myapp">
<div ng-view></div>
<div ng-controller="loginCtrl">
<form action="/" id="login">
Username: <input type="text" name="username" id="username" ng-model="username"><br>
Password: <input type="password" name="password" id="password" ng-model="password"><br>
<button type="button" ng-click="submit()">Login</button>
</form>
</div>
</body>
</html>
dashboard.html
<html>
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="bower_components/angular/angular.min.js" type="text/javascript"></script>
<script src="bower_components/angular-route/angular-route.min.js" type="text/javascript"></script>
<script src="app.js" type="text/javascript"></script>
</head>
<body ng-app="myapp">
<div ng-view></div>
some text
</body>
</html>
Because of you load all script files for both page and load index.html for '/' path that circular loading index.html page that's why you got this error.
In dashboard.html no need to load your script files again just write your information nothing else . And your login form move to another page like login.html and refer this page for path "/".
like:
route provider:
.when('/', {
templateUrl: 'login.html'
})
index.html page
<body ng-app="myapp">
<h1>Welcome </h1>
<div ng-view></div>
</body>
login.html page
<div ng-controller="loginCtrl">
<form action="/" id="login">
Username: <input type="text" name="username" id="username" ng-model="username"><br>
Password: <input type="password" name="password" id="password" ng-model="password"><br>
<button type="button" ng-click="submit()">Login</button>
</form>
</div>
and dashboard.html
<div ng-controller="CtrlName"> //ng-controller="CtrlName" if need ctrl and also can use ctrl in route provider
<h2> Dashboard page</h2>
// all of your information's
</div>
It may will work perfectly
| 归档时间： |
|
| 查看次数： |
17257 次 |
| 最近记录： |