私はイオンアプリを持っています。私はユーザーが認証されているかどうかに基づいて、サイドメニューのリンクを変更したいと思います。だから、私はこのようなテンプレートやページを設定している路線で:イオンサイドメニュー - ユーザーが認証されているかどうかに基づいてリンクを表示します。
module.export = angular.module('coop').config(function($stateProvider, $urlRouterProvider) {
$stateProvider
//side menu
.state('main', {
url: '/main',
abstract: true,
templateUrl: 'templates/main.html',
})
.state('main.public', {
url: '/public',
views: {
'content': {
templateUrl: 'templates/public.html',
controller: 'PublicController'
}
},
authenticate: false
})
.state('main.articles', {
url: '/articles',
views: {
'content': {
templateUrl: 'templates/articles.html',
controller: 'ArticlesController'
}
},
authenticate: true
})
ので、リンク状態はauthenticate: true
またはfalse
を持っているかどうかに基づいて、状態main.public
とmain.articles
とすべての他の州ごとに異なるべきです。サイドメニューではどうすれば確認できますか?
<ion-side-menus>
<ion-side-menu side="left" class="side-menu" scroll="false">
<ul class="menu">
<div class="side-menu-header">
</div>
<div class="menu-main">
<li>
<a ng-if="authenticated" menu-close ui-sref="main.profile">Min profil</a>
<a ng-if="!authenticated" menu-close ui-sref="main.login">Logg in</a>
</li>
</div>
<div class="menu-last">
<li>
<a ng-if="authenticated" menu-close ui-sref="main.logout">Logg out</a>
</li>
</div>
</ul>
</ion-side-menu>
<ion-side-menu-content>
<ion-nav-view name="content"></ion-nav-view>
</ion-side-menu-content>
</ion-side-menus>
更新
これが必要になる場合がありますどのように、誰のために、私はapp.js
のstateChangeStart
にrootscope変数を設定することによってそれを解決:
// Check for login status when changing page URL
$rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams) {
var currentRoute = toState.name;
$rootScope.authenticated = false;
if ($auth.isAuthenticated()) {
$rootScope.authenticated = true;
}