我在制作 angularjs 应用程序时遇到问题。 我创建一个 Controller 并将其绑定(bind)在routeProvider 中。使用一个函数来初始化 Controller 的值，如下所示。
angular.module('app.Login', ['app.rpc','ngRoute'])
.config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/login', {
templateUrl: '/static/tour/app/login/login.html',
controller: 'loginController'
});
}])
.controller('loginController', function($scope, $location, rpc) {
$scope.init = function() {
$scope.error = "";
console.log("Login Initialized");
}
$scope.init();
});
像这样的login.html
<div class="container">
<div class="row">
<div class="col-xs-12">
<h1 class="page-header">Login</h1>
</div>
</div>
<div class="row">
<div class="col-xs-12">
<div class="alert alert-danger alert-dismissable" role="alert" ng-show="error">
<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>
<strong>Error: </strong>
<span>{{error}}</span>
</div>
</div>
</div>
<div class="row">
<div class="col-xs-12">
<form>
<div class="form-group">
<label>Username</label>
<input type="text" class="form-control" ng-model="username" placeholder="Username">
</div>
<div class="form-group">
<label>Password</label>
<input type="password" class="form-control" ng-model="password" placeholder="Password">
</div>
<button class="btn btn-primary action-btn" ng-click="login()">Login</button>
</form>
</div>
</div>
</div>
当我运行应用程序时，它会像这样调用 init() 3 次。 login
在这个 stackoverflow 中发现很多人也遇到了这个问题。所有这些问题都通过确保 Controller 不会绑定(bind)多次(在 routProvider 和模板中)并检查模板中是否只有一个 ng-app 来解决。 我的主要 html 是这样的。
<!DOCTYPE html>
<html ng-app="app">
<head>
<meta charset="UTF-8">
<title>Touring</title>
<!--Bootstrap-->
<link rel="stylesheet" href="/static/tour/css/bootstrap.min.css">
<link rel="stylesheet" href="/static/tour/css/bootstrap-theme.min.css">
<!--/Bootstrap-->
</head>
<body>
<ng-view><ng-view>
<!--Angular-->
<script src="/static/tour/js/angular.min.js"></script>
<script src="/static/tour/js/angular-route.min.js"></script>
<script src="/static/tour/js/angular-cookies.min.js"></script>
<!--/Angular-->
<!--App-->
<script src="/static/tour/app/app.js"></script>
<script src="/static/tour/app/rpc/app-rpc.js"></script>
<script src="/static/tour/app/login/app-login.js"></script>
<script src="/static/tour/app/dashboard/app-dashboard.js"></script>
<script src="/static/tour/app/memo/app-memo.js"></script>
</body>
</html>
对于我的主应用程序来说是这样的。
angular.module('app',
['ngCookies',
'ngRoute',
'app.Login',
'app.Dashboard',
'app.Memo',
])
.config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/', {
resolve: {
"check": function($cookies, $location) {
if(!$cookies.get("user_id")) {
$location.path("/login");
}
else {
$location.path("/dashboard");
}
}
}
})
.when('/logout', {
resolve: {
"check": function($cookies, $location) {
if($cookies.get("user_id")){
alert("You have been Logout");
}
$cookies.remove("user_name");
$cookies.remove("user_id");
$cookies.remove("token");
$cookies.remove("dbname");
$location.path("/login");
}
}
});
}]);
对于这个 Controller 来说没问题，我只是想初始化一个文本，但是在某些需要向服务器端发出一些 AJAX 请求的 Controller 中 init 是不行的，可能会发出太多需要注意的请求。任何人都可以解决这个问题请帮助我。谢谢。
PS1。我的Angular-Seed实践基础 https://github.com/angular/angular-seed
PS2。起初，我还使用了jquery，它显示警告:尝试多次加载 Angular 。一旦我删除 jquery，它就不再显示警告，但它并没有解决我的问题
最佳答案
我已经解决了
<ng-view><ng-view>
用这个代替
<div ng-view></div>
关于javascript - Angularjs - Controller 多次调用 init() 函数，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33365978/