我已经创建了登录表单。我想在成功登录后在导航栏上显示配置文件菜单项。我在控制器内使用http服务将数据发布到数据库,以验证用于登录的电子邮件和密码组合。未使用的服务或工厂。 我使用ui_router进行导航。
我的导航栏页面是
<!-- Navigation -->
<nav class="navbar navbar-inverse" role="navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" ui-sref="home"> <img src="images/logo.png" /></a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li ui-sref-active="active"><a ui-sref="home">HOME</a></li>
<li ui-sref-active="active"><a ui-sref="register">REGISTER</a></li>
<li ui-sref-active="active"><a ui-sref="login">SIGN IN</a></li>
<li ui-sref-active="active"><a ui-sref="contact">CONTACT</a></li>
</ul>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container -->
</nav>
我的登录页面是
<div class="col-lg-6 col-lg-offset-3 well " style="margin-top:1em; background-color:black; ">
<h4 style="color:white; text-align:center;"> <strong> LOGIN </strong> </h4>
</div>
<div class="col-lg-6 col-lg-offset-3 well" style="margin-bottom:13em;">
<form name="login" ng-app="TempleWebApp" ng-controller="logCtrl" ng-submit="signin(login.$valid)" novalidate>
<div class="form-group col-lg-12" ng-class="{ 'has-error' : login.email.$invalid && (login.email.$dirty || submitted)}">
<label>Email</label>
<input class="form-control" type="text" name="email" ng-model="useremail" placeholder="Email" ng-pattern="/^[^\s@]+@[^\s@]+\.[^\s@]{2,}$/" ng-required="true">
<span class="help-block" ng-show="login.email.$invalid && login.email.$error.required && (login.email.$dirty || submitted)">
Email is required.</span>
<span class="help-block" ng-show="login.email.$error.pattern">
Enter Valid Email .</span>
</div>
<div class="form-group col-lg-12" ng-class="{ 'has-error' : login.password.$invalid && (login.password.$dirty || submitted)}">
<label>Password</label>
<input class="form-control" type="password" name="password" ng-model="userpassword" placeholder="Password" ng-required="true">
<span class="help-block" ng-show="login.password.$invalid && login.password.$error.required && (login.password.$dirty || submitted)">
Password is required.</span>
</div>
<div class="col-lg-12 well " ng-repeat="error in errors" style="background-color:red; margin-top:0.5em;"> {{ error}} </div>
<div class="col-lg-12 well" ng-repeat="msg in msgs" style="margin-top:0.5em;">
<h5 style="color:green;">{{ msg}} </h5>
</div>
<button type="submit" class="btn btn-success col-lg-12">
<span ng-show="searchButtonText == 'REDIRECTING TO PROFILE PAGE'"><i class="glyphicon glyphicon-refresh spinning"></i></span>
{{ searchButtonText }}
</button>
</form>
</div>
我的js文件是
/**
* Main AngularJS Web Application
*/
var app = angular.module('TempleWebApp', ['ui.router', 'angular-flexslider']);
/**
* Configure the Routes
*/
app.config(function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('/home');
$stateProvider
.state('home', {
url: '/home',
templateUrl: 'html/home.html',
controller: 'PageCtrl'
})
.state('contact', {
url: '/contact',
templateUrl: 'html/contact.html',
controller: 'PageCtrl'
})
.state('register', {
url: '/register',
templateUrl: 'html/register.html',
controller: 'RegisterCtrl'
})
.state('login', {
url: '/login',
templateUrl: 'html/signin.html',
controller: 'logCtrl'
})
.state('profile', {
url: '/profile',
templateUrl: 'html/profile.html',
controller: 'logCtrl'
});
})
// create angular controller for Signin
app.controller('logCtrl', function($scope, $location, $http, $timeout) {
$scope.errors = [];
$scope.msgs = [];
$scope.searchButtonText = "LOGIN";
$scope.test = "false";
$scope.signin = function(isValid) {
// Set the 'submitted' flag to true
$scope.submitted = true;
$scope.errors.splice(0, $scope.errors.length); // remove all error messages
$scope.msgs.splice(0, $scope.msgs.length);
if (isValid) {
$http.post('php/login.php', {
'email': $scope.useremail,
'pswd': $scope.userpassword
})
.success(function(data, status, headers, config) {
if (data.msg != '') {
$scope.msgs.push(data.msg);
$scope.test = "true";
$scope.searchButtonText = "REDIRECTING TO PROFILE PAGE";
var goTopayment = function() {
$scope.searchButtonText = "LOGIN";
$location.path('/profile');
};
$timeout(goTopayment, 3000);
} else {
$scope.errors.push(data.error);
}
})
.error(function(data, status) { // called asynchronously if an error occurs or server returns response with an error status.
$scope.errors.push(status);
});
} // closing bracket for IF(isvalid)
} // closing bracket for $scope.SIGNUP = function
});
答案 0 :(得分:0)
登录成功后,您可以将令牌设置为cookie,并在主页中检查cookie中是否存在令牌并显示导航项。
答案 1 :(得分:0)
public interface APIService {
@GET("{path}/following/{target}")
Call<Users> getFollowers(@Path("path") String path,@Path("{target}") String target) );
}