Angular 6 Dynamic Views with Auxiliary Routes and clean URL's

问题

In my Angular 6 project, I have some components that have a sidebar, and some of them don't. I tried to do this with auxiliary routes and it worked, but the URL's are ugly as ...!

--

What I do:

const routes: Routes = [
{
    path: 'login',
    component: LoginComponent
},
{
    path: 'search',
    component: SearchComponent
},
{
    path: 'sidebar',
    outlet: 'sidebar',
    component: SidebarComponent
}

which gives me them possible URL's

https://localhost:4200/login - (login without sidebar)

https://localhost:4200/login(sidebar:sidebar) - (login with sidebar)

https://localhost:4200/search - (search without sidebar)

https://localhost:4200/search(sidebar:sidebar) - (search with sidebar)

--

The desired result is just to have the URL's /login and /search, but the search with the sidebar and the login without the sidebar. How can I do this?

Are auxiliary routes the right way to do this? Or is there another way to do this right?

来源：https://stackoverflow.com/questions/50834187/angular-6-dynamic-views-with-auxiliary-routes-and-clean-urls