AngularJS'无法读取未定义的属性'then' [英] AngularJS 'Cannot read property 'then' of undefined'
问题描述
我遇到了这个问题,当我单击登录按钮时,Chrome控制台会记录以下内容:
I've this problem, when I click on login button, the chrome console log this:
angular.min.js:117 TypeError:无法读取未定义的属性'then' 在m.$ scope.logIn(loginModuleController.js:11)
angular.min.js:117 TypeError: Cannot read property 'then' of undefined at m.$scope.logIn (loginModuleController.js:11)
服务:
angular.module('loginModule')
.factory('loginService', function($http){
return{
login: function(username, password){
var session;
$http.post('../server/php/auth/auth.php', {
username: username,
password: password
})
.then(function(res){
session = res;
});
return session;
},
isLogged: function(){
return $http.get('../angCMS/server/php/auth.php?is_logged=true');
},
logOut: function(){
return $http.get('../angCMS/server/php/auth.php?logout=true');
}
};
});
控制器:
angular.module('loginModule')
.controller('LoginCtrl', ['$scope', 'loginService', function($scope, loginService){
$scope.auth = false;
$scope.username;
$scope.password;
$scope.logIn = function(){
loginService.login($scope.username, $scope.password).then(function(response){
}, function(res){
});
};
$scope.isLogged = function(){
loginService.isLogged()
.then(function(response){
if(response){
$scope.auth = true;
}
});
};
$scope.logOut = function(){
loginService.logOut()
.then(function(response){
if(response){
$scope.auth = false;
}
});
};
}]);
这是html模板:
<div class="container" ng-if="auth==false">
<div class="col-md-4 col-md-offset-4">
<div class="row">
<br/><h2 align="center">Login</h2>
</div>
<div class="well">
<form class="form-horizontal">
<fieldset>
<div class="form-group">
<input type="text" class="form-control" placeholder="Username" ng-model="username" required>
</div>
<div class="form-group">
<input type="password" class="form-control" placeholder="Password" ng-model="password" required>
</div>
<div class="form-group">
<button class="btn btn-md btn-primary btn-block" type="submit" ng-click="logIn()">Sign in</button>
</div>
</fieldset>
</div>
</form>
</div>
</div>
PHP登录方法:
public function login($user, $pass){
$user = htmlspecialchars(trim($user));
$pass = md5(htmlspecialchars(trim($pass)));
$res = $this->DB->prepare("SELECT * FROM `admin` WHERE username = :user");
if(!$res->execute(Array(":user"=>$user)))
die(mysql_error());
$row = $res->fetch(PDO::FETCH_ASSOC);
if(!$row['password'] == $pass)
die("Errore: password errata!");
$_SESSION['logged'] = $row;
array_push($session, $_SESSION['logged'], true);
return $session;
}
推荐答案
这更多是对诺言问题的滥用.
This is more of a misuse of promises issue.
您可能想先看一下诺言的工作原理:
You might want to first take a look of how promises work:
- https://docs.angularjs.org/api/ng/service/ $ q
- https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Promise
- https://docs.angularjs.org/api/ng/service/$q
- https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Promise
根据您的服务代码:
login: function(username, password){
var session;
$http.post('../server/php/auth/auth.php', {
username: username,
password: password
})
.then(function(res){
session = res;
});
return session;
}
调用login(username, password)
时,返回时会话仍为undefined
.
When login(username, password)
is called, session is still undefined
upon returning.
这是因为$http.post()
是异步函数,.then()
子句不会立即执行.
This is because $http.post()
is an asynchronous function, the .then()
clause does not get executed immediately.
Snixtor的答案指出,
您应该返回$http.post()
的返回值":
As pointed out by Snixtor's answer,
you should "return the return value of $http.post()
":
login: function(username, password){
return $http.post('../server/php/auth/auth.php', {
username: username,
password: password
});
}
然后引用控制器的logIn方法:
Then referring to your controller's logIn method:
$scope.logIn = function(){
loginService.login($scope.username, $scope.password).then(function(response){
// response === 'session'
}, function(res){
});
};
loginService.login().then()
中的response
参数恰好是您先前实现中预期的session
变量的值.
the response
parameter from loginService.login().then()
is exactly the value of your intended session
variable from your previous implementation.
这篇关于AngularJS'无法读取未定义的属性'then'的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!