In my app.component.ts file, I have two router outlets defined, one with the name 'popup':
@Component({
selector: 'app-main',
template: `<router-outlet></router-outlet>
<router-outlet name="popup"></router-outlet>`
})
export class AppComponent implements OnInit {
public constructor(){ }
ngOnInit(){ }
}
My route definition looks like this:
export const myappRoute: Routes =[
{
path: '',
component : DataEntryComponent
},
{
path: 'templateModal',
component: TemplateModalComponent,
outlet: 'popup'
}
];
export const TemplateRoute: ModuleWithProvider = RouterModule.forChild(myappRoute);
When I try to open the 'templateModal' route using the following code:
<button type='submit' [routerLink]="['/' , {outlets: {popup : 'templateModal'}}]" replaceUrl="true"> open </button>
I encounter an error message stating "Cannot match any routes with Url segment templateModal". I am using Angular 5. You can try this on StackBlitz here: https://stackblitz.com/edit/angular-n2eaje