3
我有一個需求,只需要在登錄頁面中隱藏我的導航欄切換。我通過使用$('.navbar-toggle').addClass('hidden-xs');
來隱藏js
。之後,我通過使用$('.navbar-toggle').addClass('visible-xs');
登錄成功後可以看到它。但是,當我登錄導航欄時仍然隱藏。預期的行爲是爲了顯示備份。導航欄可以隱藏,以後無法顯示
這裏是我的loginController.js
:
'use strict';
angular.module('titaniaApp').controller('LoginController', LoginController);
LoginController.$inject = [ '$scope', '$location', 'AuthenticationService',
'$rootScope', '$translate', '$cookies', '$http','LocalizeService' ,'localStorageService'];
function LoginController($scope, $location, AuthenticationService, $rootScope,
$translate, $cookies, $http,LocalizeService,localStorageService) {
$scope.viewLoading = true;
$('.navbar-toggle').addClass('hidden-xs');
$rootScope.dictionary=undefined;
var url=$location.url();
var lenght=url.length;
var lang =url.slice((lenght-2),lenght);
var allowedLang = [ "fi", "en", "sv" ];
lang = (lang == null || lang == '' || allowedLang.indexOf(lang) == -1) ? "fi"
: lang;
if(lang=='en'){
$rootScope.dictionary={
TITLE : "Menu",
LOGIN_PERSON_OWN_EVENTS : "Worktime",
CLOSE : "Close",
LOGIN_USERNAME : "Username",
LOGIN_PASSWORD : "Password",
LOGIN_LOGIN : "Log in",
LOGIN_CONNECTION : "Communication problem",
LOGOUT_SUCCESS : "Logout successfully",
LOGIN_TITLE: "Login"
};
}
if(lang=='fi'){
$rootScope.dictionary={
TITLE : "asiointi",
LOGIN_PERSON_OWN_EVENTS : "työaika",
CLOSE : "Sulje",
LOGIN_USERNAME : "Käyttäjätunnus",
LOGIN_PASSWORD : "Salasana",
LOGIN_LOGIN : "Kirjaudu",
LOGIN_CONNECTION : "viestintä virhe",
LOGOUT_SUCCESS : "Logout onnistuneesti",
LOGIN_TITLE: "Sähköinen asiointi - kirjautuminen"
};
}
if(lang=='sv'){
$rootScope.dictionary={
TITLE : "Sähköinen asiointi",
LOGIN_PERSON_OWN_EVENTS : "arbetstid",
CLOSE : "Sulje R",
LOGIN_USERNAME : "Användar ID",
LOGIN_PASSWORD : "Lösenord",
LOGIN_LOGIN : "Logga in",
LOGIN_CONNECTION : "viestintä virhe R",
LOGOUT_SUCCESS : "Logout onnistuneesti",
LOGIN_TITLE: "Elektronisk upphandling - inloggning"
};
}
$rootScope.loggedUser = false;
$scope.user = {};
$scope.user.updTerminal = $location.host();
if($cookies.get('language')!=lang){
$rootScope.logotSuccess = false;
}
$cookies.put('language', lang);
$scope.login = function() {
AuthenticationService.Login($scope.user, function(response) {
$('.navbar-toggle').addClass('visible-xs');
if (response.success) {
$('.navbar-toggle').addClass('visible-xs');
$rootScope.loggedUser = response.user.updUserName;
$cookies.put('sessionID', response.user.sessionId);
$cookies.put('user', response.user.updUserName);
$location.path('/findEventsLink');
} else {
if(response.message.data==null){
$scope.error = "LOGIN_CONNECTION";
}else {
$scope.error = response.message.data;
}
$rootScope.loggedUser = false;
$rootScope.logotSuccess = false;
}
});
};
var onSuccess =function(data) {
$rootScope.dictionary = data.data;
localStorageService.set("dictionary", data.data);
$scope.viewLoading = false;
};
var onFailure=function(info) {
if(info.data==null){
$scope.error="LOGIN_CONNECTION";
}
$scope.viewLoading = false;
};
$http({
method : 'POST',
url : endPointURL + 'restLocalization',
data : lang,
headers : {
'Content-Type' : 'application/json'
}
}).then(onSuccess, onFailure);
}
這裏是我的HTML:
<!DOCTYPE html>
<html data-ng-app="MyApp">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="fonts/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<link rel="shortcut icon" href="images/favicon.ico">
<link href="bootstrap-3.1.0-dist/dist/css/bootstrap.min.css" rel="stylesheet" type="text/css">
<link href="bootstrap-3.1.0-dist/dist/css/bootstrap-theme.min.css" rel="stylesheet" type="text/css">
<link href="styles/datepicker.css" rel="stylesheet" type="text/css" />
<link href="styles/personal_base.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="js/jquery-2.0.3.min.js"></script>
<script src="json/personal.json"></script>
<script type="text/javascript" src="bootstrap-3.1.0-dist/dist/js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/angular.js"></script>
<script type="text/javascript" src="js/angular-cookies.js"></script>
<script type="text/javascript" src="js/angular-local-storage.js"></script>
<script type="text/javascript" src="js/angular-translate.min.js"></script>
<script type="text/javascript" src="js/angular-ui-router.js"></script>
<script type="text/javascript" src="js/angular-translate-loader-url.min.js"></script>
<script type="text/javascript" src="js/bootstrap-datepicker.js"></script>
<script type="text/javascript" src="js/locales/bootstrap-datepicker.fi.js"></script>
<script type="text/javascript" src="js/locales/bootstrap-datepicker.sv.js"></script>
<script src="js/uiBreadcrumbs.js"></script>
<script src="js/spin.js"></script>
<script src="app-modules/MyApp.js"></script>
<script src="app-services/authenticationService.js"></script>
<script src="app-services/localize.js"></script>
<script src="app-controllers/findEventsController.js"></script>
<script src="app-controllers/loginController.js"></script>
<script src="app-controllers/findEventsLinkController.js"></script>
<script src="app-directives/loadspinner.js"></script>
<title>{{'TITLE' | translate}}</title>
</head>
<body>
<header class="navbar navbar-default navbar-static-top" id="my-nav-bar">
<div style="border-top: 10px solid RGB(227, 25, 55)"></div>
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse"
data-target="#navbar-ex-collapse" aria-expanded="false">
<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 iconAlign"><span
style="color: RGB(227, 25, 55)">VIRSHP</span></a>
<a class="navbar-brand iconAlign brand_color"><span>{{'LOGIN_PERSON_OWN_EVENTS' | translate}}</span></a>
</div>
<div class="collapse navbar-collapse" id="navbar-ex-collapse">
<ul class="nav navbar-nav navbar-right">
<li><a style="margin-right: 100px" data-ng-if="loggedUser">
<span class="fa fa-user iconAlign font-icon-size"> </span>{{ loggedUser }}</a>
</li>
<li><div data-ng-if="loggedUser">
<button data-ng-click="logout()" type="button" class="btn btn-link logoutButton" >{{'LOGOUT' | translate}}</button>
<a data-ng-click="logout()" class="fa fa-sign-out font-icon-size" style="padding-right:-12px;"></a>
</div>
</li>
</ul>
</div>
</div>
</header>
<ui-breadcrumbs data-ng-if="loggedUser"
displayname-property="data.displayName"
abstract-proxy-property="data.proxy"
template-url="app-views/uiBreadcrumbs.html"></ui-breadcrumbs>
<div class="section" data-ui-view="main"></div>
<footer class="navbar-fixed-bottom">
<div class="container">
<div class="navbar-footer">
<span style="color: RGB(227, 25, 55)"><img src="images/cgi.png" width="50"></span>
<span class="brand_color footer_align">Titania</span>
<span class="brand_color footer_align">Version.16.1.0</span>
</div>
</div>
</footer>
</body>
一旦我登錄並檢查我的導航欄,它同時使用hidden-xs
和visible-xs
。我只想要visible-xs
在這裏工作。我不知道哪裏出了問題。
請幫幫我。
它現在正在工作。謝謝。 –
很高興聽到! – mech