具有嵌套状态的Angular2路由

发布时间：2020-12-17 18:02:48 所属栏目：安全来源：网络整理

导读：我有一个登陆页面,它将显示用户(默认情况下)和“注册”组件,这是一组允许他们注册的输入字段. 对于返回用户,我希望他们按原样查看登录页面,然后单击“登录”,只需用登录组件替换注册组件.我不希望URL改变,它应该保持’/’. 对于ui-router我可以做嵌套状态,但

我有一个登陆页面,它将显示用户(默认情况下)和“注册”组件,这是一组允许他们注册的输入字段.

对于返回用户,我希望他们按原样查看登录页面,然后单击“登录”,只需用登录组件替换注册组件.我不希望URL改变,它应该保持’/’.

对于ui-router我可以做嵌套状态,但不确定Angular2的路由器是否支持呢？

app.ts

@Component({
  selector: 'app',template: '
    *snip*
    <router-outlet></router-outlet>
    *snip*
  ',directives: [Footer,ROUTER_DIRECTIVES]
})
@RouteConfig([
  { path: '/...',name: 'Landing',component: LandingComponent,useAsDefault: true },{ path: '/about',name 'About',component: AboutComponent }
]);

landing.ts

@Component({
  selector: 'landing',template: '
    <body>
      <div>
        <router-outlet></router-outlet>
      </div>
    </body>',directives: [ROUTER_DIRECTIVES]

})
@RouteConfig([
  { path: '/',name: 'RegisterForm',component: RegisterForm,{ path: '/login',name: 'LoginForm',component: LoginForm },])

着陆组件的路径是否需要不同？

解决方法

为什么你需要使用这条路线呢？你不能只绑定到隐藏或显示相应部分的布尔值吗？

<div *ngIf="showReg">Registration</div>

<div *ngIf="!showReg">Login</div>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!