[英]Angular JS Ng-Show / Ng-Hide
我正在为登录表单编写角度服务。 我已经编写了一家工厂(并使用了http注入器),负责将摘要HTTP凭据提交给其余服务。 我的身份验证正常,但是我遇到的问题与错误消息有关,如果提供了错误的凭据,我将显示该错误消息。
我包括了一个带有errorAlertTextElem的ng-show值的div。 当资源工厂的$ resolved状态为false时,我想显示ng-show errorAlertTextElem元素。 目前,此方法有效,但仅需片刻。 当我输入不正确的凭据并单击登录时,错误消息将显示一秒钟,然后消失。 我一直试图找出原因。 我想知道是否需要使用$ scope。$ apply(),但是由于摘要已经在进行中,因此无法正常工作。 我在这里想念什么?
角度控制器代码:
//angular.js controller code portion
loriaGameControllers.controller('signinController', ['$scope', 'Users',function($scope,Users){
$scope.signin = function()
{
//Users is a factory that makes a restful resource call.
var test = Users.userInfo().query();//this returns a promise and $resolved
console.log(test);
if(test.$resolved == false){
$scope.errorAlertTextElem = true;//right here is where I attempt to set the ng-show value to true so that the error box will be true. However, the errorAlertTextElem only displays for a second and then goes away.
}
};
}]);
html代码登录表单代码(位于我的ng-app中):
<form class="form-signin col-md-6" role="form" name="signinForm" ng-controller="signinController">
<h2 class="form-signin-heading">Sign In</h2>
<!-- The error message I want to show-->
<div class="alert alert-danger" ng-show="errorAlertTextElem">Invalid Username or Password</div>
<input type="email" class="form-control" placeholder="Email address" ng-model="username" name="username"required autofocus>
<input type="password" class="form-control" placeholder="Password" ng-model="password" name="password"required>
<label class="checkbox">
<input type="checkbox" value="remember-me"> Remember me
</label>
<!--ng-click that triggers the callback-->
<div class="btn btn-lg btn-primary btn-block" ng-click="signin()">Sign in</div>
</form>
只有在发生http错误时,角度资源才会拒绝。 这意味着,当发生类似“ 404”或“ 505”的错误时,解决方案将为假。 要使代码正常工作,您应该处理来自服务器的resolve响应以显示消息。
test.$promise.resolve(function(response){
// handle the error come from you server
console.log(response);
// show error msg?
});
我已经解决了这个问题。 我使用的进样器位置发生了变化。 因此,每次进样器运行时,都会重新加载模板。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.