如何防止 angular 中的状态加载 2

Question

我的组件：

constructor(
        private router: Router
    ) {

        router.events.subscribe((val) => {
            if (val instanceof NavigationStart && !isloggedIn) {
                console.log(val);
            }
        });
    }

如果用户已登录navigationStart，我想在用户未登录的情况下阻止用户加载页面。angular2中如何做到这一点？

Answer 1

您应该创建 AuthGuard 为用户在未登录时不应该登陆的所有路线设置它。

const routesConfig: Routes = [
   {
       path: 'admin',
       component: AdminLayoutComponent,
       canActivate: [AuthGuard],        
       children: [
           { path: 'dashboard', component: AdminDashboardComponent },            
       ]
   },
   {path: 'admin-login', component: AdminLoginComponent},
   {path: 'login', component: LoginComponent},
   {path: '**', redirectTo: ''}
];

这是简单的 AuthGuard。

  @Injectable()
  export class AuthGuard implements CanActivate {
      constructor() {}

   canActivate() {
      let user = JSON.parse(localStorage.getItem('user'))

      // here do logic for navigate to login if user don't have local storage...

      return true;
      }
   }

有关详细信息，请查看此 link。

如何防止 angular 中的状态加载 2

How to prevent state loading in angular 2

javascript

typescript

angular2-routing

angular