从另一个父级到命名路由的角度路由答案

【问题标题】：Angular routing to named rout from another parent从另一个父级到命名路由的角度路由
【发布时间】：2020-04-12 16:30:47
【问题描述】：

你的孩子们怎么样。

我是 Angular 新手，正在尝试构建一个合适的 rout 导航系统到目前为止，我有这样的溃败：

{path: 'welcome',
  component: WelcomeComponent,
  children: [
    {path: 'login',
      component: LoginComponent,
    outlet: 'welcomeR'},
    {path: 'register',
      component: RegistrationComponent,
      outlet: 'welcomeR'},
    {path: '',
      component: StartComponent
    }
  ]},
  { path: 'user',
    component: UserComponent,
    canActivate: [RoutProtectionService],
    children: [
      {path: '',
        pathMatch: 'full',
      redirectTo: 'profile'},
      {path: 'profile',
       component: ProfileComponent,
        outlet: 'userR'
      },
      { path: 'browseTutors',
        component: TutorsBrowseComponent,
        outlet: 'userR'
      }]
  },
  {path: '**',
  redirectTo: '/welcome'}

从结构中可以看出，我的应用程序组件中有一个<router outlet>，并且 userR/welcomeR 路由作为其中的子文件夹。

成功登录后，我想重定向到用户/配置文件组件，但我不知道该怎么做... 如果我使用这样的东西：

      this.router.navigate([{outlets: { userR: ['profile']}}] );

它无法匹配任何溃败。如果我导航到['/user']，我不会显示个人资料。我也尝试过类似问题上列出的其他方法，但它们似乎不起作用。例如：

  this.router.navigate(['/user','profile'];

我已尝试删除 outlet:'userR' 然后使用 '/user/profile' 访问它，但是使用这种方法，不会显示配置文件的内容。

作为替代方案，我还尝试在用户组件的“路径”上设置重定向到“配置文件”，但这也不起作用...

【问题讨论】：

标签： angular routing web-deployment angular-router

【解决方案1】：

只需确保您在以下组件中有 <router-outlet></router-outlet>：AppComponent、WelcomeCompoonent 和 UserComponent 模板。然后不要在路由定义或导航中使用命名出口。

【讨论】：

感谢您的回复！希望您度过愉快的一天，并保持健康。
也谢谢你=)

【解决方案2】：

我总是使用包含 <router-outlet></router-outlet> 的 baseRouterComponent 它是父路由对象。

要重定向，您可以使用router.navigateByUrl("/user")

working example

【讨论】：

很抱歉，我可能没有正确理解您的回答。无论如何，感谢您的时间和回复。我希望你有一个美好的一天，保持健康。