Modal Dialog Route in Angular
The other day I was working on a pet project in Angular. One of the things I wanted to achieve was to have a route which will show a popup. In simple words the case looks the following: the user is on a main page https://pet-project.com/ , then navigates to https://pet-project.com/create through a link etc. and gets a popup dialog on top of a main page. Showing one page on top of the other can be simply done through child routes (make sure your parent view has a router-outlet to show child components): import { NgModule } from '@angular/core'; import { Routes, RouterModule } from '@angular/router'; import { FeedComponent } from './feed/feed.component'; import { DialogComponent } from './dialog/dialog.component'; const routes: Routes = [ { path: '', component: FeedComponent, children: [ { path: 'create', component: DialogComponent }, ] } ]; @NgModule({ imports: [RouterModule.forRoot(routes)], exports...