Question

我的其中一个模块中有这些路线：

const routes: Routes = [
  { path: '', redirectTo: 'public/intro', pathMatch: 'full'},
  { path: 'public', component: PublicComponent, data: { preload: true, delay: true, state: 'public' },
  children:
  [
    { path: 'intro', component: IntroComponent, data: { preload: true, delay: true, state: 'intro' },  },
    { path: 'explorar', component: ExplorarComponent, data: { preload: true, delay: true, state: 'explorar' }, },
    { path: 'cadastro', component: CadastroComponent, data: { preload: true, delay: true, state: 'cadastro' }, },
    { path: 'entrar', component: EntrarComponent, data: { preload: true, delay: true, state: 'entrar' }, },
  ]},
];

如何防止用户键入例如：

localhost：4200 /＃/ public

并直接访问父组件（公共）？

我的意思是我只允许在该特定区域使用这些路线：

localhost：4200 /＃/ public / intro

localhost：4200 /＃/ public / explorar

localhost：4200 /＃/ public / cadastro

localhost：4200 /＃/ public / entrar

问题是，我在PublicComponent内有一个路由器插座。我在那里加载了四个孩子。（带有路径按钮的工具栏）。

谢谢。

Answer 1

您可以使用here中所述的无组件路由来实现。

在您的情况下，您会遇到以下情况：

const routes: Routes = [
  { path: '', redirectTo: 'public/intro', pathMatch: 'full'},
  { path: 'public', children: [
    { path: 'intro', component: IntroComponent },
    { path: 'explorar', component: ExplorarComponent },
    { path: 'cadastro', component: CadastroComponent },
    { path: 'entrar', component: EntrarComponent },
  ]}
];

禁止直接访问父组件

1 个答案: