Переменная доступа с маршрутизатора в Angular

0

Я работаю над веб-приложением с Angular. Я создал заголовок, который включен в index.html, поэтому он привязан к каждой странице, а содержимое страницы вводится через ui-view. Мой вопрос: если я хочу показывать этот заголовок только после того, как пользователь прошел страницу регистрации и входа в систему, что мне делать?

Я добавил переменную на свой маршрутизатор, как показано ниже, но я не уверен, как получить доступ к переменной маршрутизатора из index.html, поскольку она не привязана к контроллеру (поскольку это фиксированный контент на всех страницах). Я намеревался просто выбросить ng-hide = "hideHeader" в index.html.

app.config(function($stateProvider, $urlRouterProvider) {

$urlRouterProvider.otherwise('/login');

$stateProvider
    .state('login', {
        url: '/login',
        templateUrl: 'app/views/login/login.html',
        controller: 'loginController',
        controllerAs: 'vm',
        hideHeader: true
    })

    .state('signup', {
        url: '/signup',
        templateUrl: 'app/views/signup/signup.html',
        controller: 'signupController',
        controllerAs: 'vm',
        hideHeader: true
    })

    .state('landing', {
        url: '/landing',
        templateUrl: 'app/views/landing/landing.html',
        controller: 'landingController',
        controllerAs: 'vm',
        hideHeader: false
    })

    .state('account-management', {
        url: '/account-management',
        templateUrl: 'app/views/account-management/account-management.html',
        controller: 'accountManagementController',
        controllerAs: 'vm'
        hideHeader: false
    });
});

Как я могу получить доступ к этому значению hideHeader из index.html? Есть ли способ установить глобальную переменную области видимости и получить значение оттуда?

  • 0
    Просто примечание: ng-if легче, чем ng-hide / ng-show, поэтому я бы использовал его, когда это возможно. Кроме того, когда вы добавляете данные в состояние, вы должны использовать параметр данных, как показано в документации здесь .
Теги:
angular-ui-router

1 ответ

3
Лучший ответ

Здесь используется другой подход: создайте службу специально для аутентификации (входа/выхода из системы) и состояния аутентификации. Затем просто вызовите эту службу в своем заголовке. Учитывая, что заголовок зависит от вашей аутентификации, тогда имеет смысл отвлечь это. Контроллеры входа/регистрации будут взаимодействовать с этой службой.

Теперь ваши маршруты также могут вызвать эту службу, чтобы проверить, разрешают ли они пользователю просматривать их на основе состояния входа.

  • 1
    Я согласен, что это наиболее подходящее решение, если есть много контроллеров, которые будут полагаться на аутентификацию. Это также позволит централизованный доступ к пользовательским разрешениям, данным и т. Д.
  • 0
    Это здорово, спасибо @Akshay.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню