I'm getting the following error when I try to open a new form via [routerLink]:
error_handler.js:54
EXCEPTION: Uncaught (in promise): Error: Cannot match any routes.
URL Segment: 'usuario-cadastrar-dialog' Error: Cannot match any routes.
URL Segment: 'usuario-cadastrar-dialog'
HTML Page:
<h1>Usuários</h1>
<button type="button" *ngIf="mostrarBotaoNovo"
[routerLink]="['/', { outlets: { popup: ['usuario-cadastrar-dialog'] }
}]"
class="btn btn-default">
<i class="fa fa-user" aria-hidden="true"></i> Novo usuário
</button>
user-routing.ts:
import {NgModule} from "@angular/core";
import {RouterModule} from "@angular/router";
import {GerenciarUsuarioComponent} from "./usuario-gerenciar/usuario-gerenciar.component";
import {CadastrarEditarUsuarioDialogComponent} from "./usuario-cadastrar-dialog/usuario-cadastrar-dialog.component";
@NgModule({
imports: [
RouterModule.forChild([
{
path: 'administracao',
children: [
{path: 'usuario', component: GerenciarUsuarioComponent},
{path: 'usuario-cadastrar-dialog', component: CadastrarEditarUsuarioDialogComponent, outlet: 'popup'}
]
}
])
],
exports: [RouterModule]
})
export class UsuarioRouting {
}
app-routing.module.ts:
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import {PrincipalComponent} from "./principal/principal.component";
import {UsuarioRouting} from "./usuario/usuario-routing";
const routes: Routes = [
{
path: '',
pathMatch: 'full',
component: PrincipalComponent
},
...UsuarioRouting
];
@NgModule({
imports: [RouterModule.forRoot(routes, {useHash: true})],
exports: [RouterModule],
providers: []
})
export class AppRoutingModule { }