All geek questions in one place

Angular2 Nested State Routing

I have a landing page in which the user (by default) and the "Register" component will be presented, which is a set of input fields that allow them to register.

For returning users, I would like them to see the landing page as it is, then click on "Login" and simply replace the registration component with the login component. I do not want the URL to change, it should remain '/'.

For ui-router, I could execute nested states, but not sure if Angular2 still supports the router?

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 }, ])

Should the different paths for the landing component be different?

+5
source share
1 answer

Why do you even need to use a route? Can't you just get attached to the logical one that hides or shows the corresponding section?

 <div *ngIf="showReg">Registration</div> <div *ngIf="!showReg">Login</div>
-2
source

Source: https://habr.com/ru/post/1239680/

More articles:


All Articles