时间戳

首页 > 解决方案 > 停用 ngx-rocket angular 7 入门套件中某些页面的登录屏幕

angular - 停用 ngx-rocket angular 7 入门套件中某些页面的登录屏幕

问题描述

我正在使用 ngx-rocket angular7 入门套件。它实施了一个守卫，如果我还没有登录，它将弹出登录屏幕。要实现注册页面，我不希望弹出登录屏幕，注册页面应该是公开的。有谁知道如何停用那里的登录屏幕？

标签： angularangular7canactivate

解决方案

这取决于您如何实现注册页面、显示代码、定义链接和注册路径的位置。通常，该模板AuthenticationGuard在辅助函数中使用。检查About模块：

const routes: Routes = [
  Shell.childRoutes([
    { path: 'about', component: AboutComponent, data: { title: extract('About') } }
  ])
];

如果您在没有Shell.childRoutes帮助程序的情况下使用路由定义注册模块，它将不会触发AuthenticationGuard，因此不会重定向到login. 像这样：

const routes: Routes = [
    { path: 'register', component: RegisterComponent, data: { title: extract('Register') } }
];

如果还想保留原始Shell功能，路线可以如下：

const routes: Routes = [
   {
      path: '',
      component: ShellComponent,
      children: [
        { path: 'register', component: RegisterComponent, data: { title: extract('Register') } }
      ],
      // canActivate: [AuthenticationGuard],
      // Reuse ShellComponent instance when navigating between child views
      data: { reuse: true }
    }

];

作为替代方案，可以在Shell其中定义助手：

export class Shell {

  // existing helper
  static childRoutes(routes: Routes): Route {
    return {
      path: '',
      component: ShellComponent,
      children: routes,
      canActivate: [AuthenticationGuard],
      // Reuse ShellComponent instance when navigating between child views
      data: { reuse: true }
    };
  }

  // add new helper without guard
  static unAuthenticatedChildRoutes(routes: Routes): Route {
    return {
      path: '',
      component: ShellComponent,
      children: routes,
      // Reuse ShellComponent instance when navigating between child views
      data: { reuse: true }
    };
  }
}

然后，在您的组件中：

const routes: Routes = [
  Shell.unAuthenticatedChildRoutes([
    { path: 'register', component: RegisterComponent, data: { title: extract('Register') } }
  ])
];

推荐阅读