2016-01-02 4 views
5

У меня есть целевая страница, которая представит пользователю (по умолчанию) и компонент «Зарегистрироваться», который представляет собой набор полей ввода, позволяющих им регистрироваться.Маршрутизация Angular2 с вложенными состояниями

Для возвращения пользователей я хотел бы, чтобы они увидели целевую страницу как есть, затем нажмите «Войти» и просто замените компонент регистрации компонентом входа. Я не хочу, чтобы 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, useAsDefault: true }, 
    { path: '/login', name: 'LoginForm', component: LoginForm }, 
]) 

Do пути для компонента посадки должны быть разными?

ответ

-2

Зачем вам вообще нужно использовать маршрут? Не можете ли вы просто привязать к логическому, который скрывает или показывает соответствующий раздел?

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

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

Это не отвечает на вопрос. –

+0

Не отвечает на вопрос – Scipion