У меня одностраничное приложение AngularJS, работающее с Express, node.js и MongoDB через Mongoose. Использование паспорта для управления пользователями/проверки подлинности.
Я хочу, чтобы элементы навигационной панели менялись в зависимости от того, вошел ли пользователь в систему или нет. Мне сложно понять, как его реализовать.
Я выясню, зарегистрирован ли пользователь через запрос http
:
server.js
app.get('/checklogin',function(req,res){
if (req.user)
res.send(true);
else
res.send(false);
На переднем конце у меня есть NavController
, вызывающий это с помощью службы Angular $http
:
NavController.js
angular.module('NavCtrl',[]).controller('NavController',function($scope,$http) {
$scope.loggedIn = false;
$scope.isLoggedIn = function() {
$http.get('/checklogin')
.success(function(data) {
console.log(data);
if (data === true)
$scope.loggedIn = true;
else
$scope.loggedIn = false;
})
.error(function(data) {
console.log('error: ' + data);
});
};
};
В моем навигаторе я использую ng-show
и ng-hide
, чтобы определить, какие выборы должны быть видимыми. Я также запускаю функцию isLoggedIn()
, когда пользователь нажимает на элементы nav, проверяя, вошел ли пользователь во время каждого нажатия.
index.html
<nav class="navbar navbar-inverse" role="navigation">
<div class="navbar-header">
<a class="navbar-brand" href="/">Home</a>
</div>
<ul class="nav navbar-nav">
<li ng-hide="loggedIn" ng-click="isLoggedIn()">
<a href="/login">Login</a>
</li>
<li ng-hide="loggedIn" ng-click="isLoggedIn()">
<a href="/signup">Sign up</a>
</li>
<li ng-show="loggedIn" ng-click="logOut(); isLoggedIn()">
<a href="#">Log out</a>
</li>
</ul>
</nav>
Проблема
В моем приложении есть другие места, где пользователь может войти в систему/выйти за пределы области NavController. Например, на странице входа есть кнопка входа в систему, которая соответствует LoginController. Я предполагаю, что есть лучший способ реализовать это во всем моем приложении.
Как я могу "посмотреть", есть ли req.user
true
на задней панели и отвечать ли мои навигационные элементы?