angular - angular2登录页面的不同布局

Question

我的所有页面都有一个带有工具和侧边栏的正常布局，但当用户转到登录或注册页面时，它们不应该是可见的。在 AngularJS 中，使用 ui-router 很容易在您可以定义布局的所有其他页面之前包含一个路由。

但是如何在 Angular2 中使用本地路由器来实现呢？我应该使用 ngIf 来显示工具栏和侧边栏还是有更好的方法？

Answer 1

可以通过路由的 children 属性实现:

export const routes:RouterConfig = [
  //includes the login and registration route
  ...userRoutes,
  {
    path: '',
    //checks if the user is logged in
    canActivate: [Auth],
    //only contains a <route-outlet />
    component: LayoutComponent,
    //routes like /dashboard will only accessible when Auth returns true
    children: [
      //all children are 'protected'
      ...modulRoutes,
      ...dashboardRoutes,
    ]
  },
  //404 handling
  ...errorRoutes
];

我用的是angular2的3.0路由器