Проверка предварительных условий маршрута перед загрузкой контроллера

Я пишу одностраничное приложение в Angular, в частности угловое.Дарт!--2-->, но я предполагаю, что этот вопрос все еще относится к AngularJS.

возьмем для примера следующие маршруты:

/ login - Ожидает, что никто не войдет в систему. Если кто-то аутентифицирован, но не зарегистрирован, перенаправьте на маршрут "Регистрация", если они зарегистрированы, перенаправьте на маршрут "домой".

/Регистрация - Ожидает проверки подлинности пользователь, который не завершил процесс регистрации. Если не аутентифицирован, перенаправьте на login. Если аутентифицируется, перенаправьте на дом.

/главная - Ожидает аутентифицированного и зарегистрированного пользователя. Если не аутентифицирован, перенаправьте на маршрут" вход", если не зарегистрирован, перенаправьте на маршрут "Регистрация".

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

любая помощь была бы очень признательна!

8
angular-dart dart

4 ответов

Угловое.Dart и угловые.Фреймворки маршрутизации JS очень / принципиально отличаются. Угловатый.Dart использует стороннюю структуру маршрутизации (https://github.com/dart-lang/route/tree/experimental_hierarchical) и только реализует угловые особенности, такие как ng-view и способы привязки маршрутов к шаблонам через ViewFactory.

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

тем временем вы можете попробовать создать пользовательскую оболочку viewFactory.

class RecipesRouteInitializer implements RouteInitializer {
   void init(Router router, ViewFactory view) {
     router
       ..addRoute(
          name: 'login',
          path: '/login',
          enter: authView(router, view('login.html'), NOT_AUTH))
       ..addRoute(
          name: 'register',
          path: '/register',
          enter: authView(router, view('register.html'), AUTH_NO_REG))
       ..addRoute(
          name: 'home',
          path: '/home',
          enter: authView(router, view('home.html'), AUTH_AND_REG));
   }

   authView(Router router, ngView, mode) {
     return (RouteEvent e) {
       if (mode == AUTH_AND_REG) {
         if (!authService.isAuth) {
           router.go('login', {});
           return;
         }
         if (!authService.isReg) {
           router.go('register', {});
           return;
         }
       } else if (mode == AUTH_NO_REG) {
         if (!authService.isAuth) {
           router.go('login', {});
           return;
         }
         if (authService.isReg) {
           router.go('home', {});
           return;
         }
       } else if (mode == NOT_AUTH) {
         if (authService.isAuth) {
           router.go('register', {});
           return;
         }
       }
       ngView(e);
     };
   }

}

DISCLAMER: это просто идея... это может не сработать.

4

Ну, я сделал вещь в Dart, которая близка к одному из предыдущих решений, которые на самом деле не работают. Главное, что в RouteEventHandler нужно позвонить RouteEventHandler представления.

      ..addRoute(
          name: 'userAdd',
          path: '/userAdd',
          enter: checkAuthentication(router,view,'view/addUser.html'))
      ..addRoute(
        name: 'login',
        path: '/login',
        enter: view('view/login.html'));
  }

  RouteEventHandler checkAuthentication(Router router,ViewFactory view, String location){
     return (RouteEvent e) {
      if(_authenticationService.isAuthenticated()){
        view(location)(e);
      }else{
        router.go("login",{});
      }
    };
  }
3

Примечание: это относится только к AngularJS, оставляя это в случае, если кто-то использует JS нуждается в этом.

посмотри resolve в собственность $routeProvider. Вы можете вернуть обещание, которое определит, следует ли принимать изменение маршрута или нет.

документы:

Если какая-либо из этих зависимостей является обещаниями, маршрутизатор будет ждать их разрешения или отклонения до экземпляр контроллера создан. Если все обещания разрешены успешно, значения разрешенных обещаний вводятся и событие $routeChangeSuccess запускается. Если какое-либо из обещаний отклоняется, событие $routeChangeError запускается.

также есть видео об этом и жизненном цикле маршрута на egghead.io здесь

1

Я знаю, что следующее решение не применимо к Angular.Dart, но все же стоит упомянуть решение для ui-router:

https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions#how-to-create-rules-to-prevent-access-to-a-state

app.config(function($stateProvider) {
  $stateProvider.state('privatePage', {
  data: {
    rule: function(user) {
    // ...
  }
});
});
app.run(function($rootScope, $state, $currentUser) {
$rootScope.$on('$stateChangeStart', function(e, to) {
if (!angular.isFunction(to.data.rule)) return;
var result = to.data.rule($currentUser);

if (result && result.to) {
  e.preventDefault();
  // Optionally set option.notify to false if you don't want 
  // to retrigger another $stateChangeStart event
  $state.go(result.to, result.params, {notify: false});
}
});
});
0