Menu e rotas e subrotas

Olá, Guilherme.

Como está seu template do AppModule?

Você tem um GitHub com um código que dê pra reproduzir o problema de maneira fácil?

O Git que tenho é privado.

O código está assim:

import * as $ from 'jquery';
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { FormsModule } from '@angular/forms';
import { HttpClientModule, HttpClient } from '@angular/common/http';
import { LocationStrategy, HashLocationStrategy } from '@angular/common';
import { AppRoutes } from './app.routing';
import { AppComponent } from './app.component';

import { FlexLayoutModule } from '@angular/flex-layout';
import { FullComponent } from './layouts/full/full.component';
import { AppBlankComponent } from './layouts/blank/blank.component';
import { AppHeaderComponent } from './layouts/full/header/header.component';
import { AppSidebarComponent } from './layouts/full/sidebar/sidebar.component';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { DemoMaterialModule} from './demo-material-module';

import { PerfectScrollbarModule } from 'ngx-perfect-scrollbar';
import { PERFECT_SCROLLBAR_CONFIG } from 'ngx-perfect-scrollbar';
import { PerfectScrollbarConfigInterface } from 'ngx-perfect-scrollbar';

import { SharedModule } from './shared/shared.module';
import { SpinnerComponent } from './shared/spinner.component';
import { HttpModule } from '@angular/http';
import { ServicoModule } from './servico/servico.module';
import { UsuarioModule } from './paginas/usuario/usuario.module';
import { ParametroModule } from './paginas/parametro/parametro.module';
import { EnderecoModule } from './paginas/endereco/endereco.module';
import { ErrorModule } from './erro/error.module';
import { MunicipioIntegradoModule } from './paginas/municipio-integrado/municipio-integrado.module';
import { BancoModule } from './paginas/banco/banco.module';

const DEFAULT_PERFECT_SCROLLBAR_CONFIG: PerfectScrollbarConfigInterface = {
  suppressScrollX: true,
  wheelSpeed: 2,
  wheelPropagation: true,
};

@NgModule({
  declarations: [
    AppComponent,
    FullComponent,
    AppHeaderComponent,
    SpinnerComponent,
    AppBlankComponent,
    AppSidebarComponent
  ],
  imports: [
    HttpModule,
    BrowserModule,
    BrowserAnimationsModule,
    DemoMaterialModule,
    FormsModule,
    FlexLayoutModule,  
    HttpClientModule,
    PerfectScrollbarModule,
    SharedModule,  
    RouterModule.forRoot(AppRoutes),
    ErrorModule,
    ServicoModule,
    UsuarioModule,
    ParametroModule,
    EnderecoModule,
    MunicipioIntegradoModule,
    BancoModule
  ],
  providers: [
    {
      provide: PERFECT_SCROLLBAR_CONFIG,
      useValue: DEFAULT_PERFECT_SCROLLBAR_CONFIG
    },{
      provide: LocationStrategy,
      useClass: HashLocationStrategy
    }
  ],
  bootstrap: [
    AppComponent
  ]
})
export class AppModule {}

Olá Guilherme, realmente a estrutura de roteamento desta aplicação é bem elaborada. Estava vendo alguns exemplos de lazy loading de módulos no Angular, muito parecidos com o q vc fez e vi que utilizam o parâmetro "pathMatch: 'full'" (https://angular.io/guide/lazy-loading-ngmodules#routes-at-the-app-level), não sei se vc já tentou fazer isso.

Outra coisa que percebi tb foi que tanto o AppRoutes qt o EnderecoRoutes tem na raiz somente o path: '', será que é realmente necessário? Não poderia por exemplo diminuir o nível das rotas? Digo isso pq o match com a rota '' é sempre meio complicado de controlar. Por exemplo, será que a rota de endereço não poderia ser algo como:

export const EnderecoRoutes: Routes = [
  {
    path: 'pais',
    component: PaisComponent
  },
  {
    path: 'pais/novo',
    component: PaisFormComponent
  },
  {
    path: 'pais/alterar/:id',
    component: PaisFormComponent
  },
  {
    path: 'estado',
    component: EstadoComponent
  },
  {
    path: 'estado/novo',
    component: EstadoFormComponent
  },
  {
    path: 'estado/alterar/:id',
    component: EstadoFormComponent
  },
  {
    path: 'bairro',
    component: BairroComponent
  },
  {
    path: 'bairro/novo',
    component: BairroFormComponent
  },
  {
    path: 'bairro/alterar/:id',
    component: BairroFormComponent
  },
  {
    path: 'logradouro',
    component: LogradouroComponent
  },
  {
    path: 'logradouro/novo',
    component: LogradouroFormComponent
  },
  {
    path: 'logradouro/alterar/:id',
    component: LogradouroFormComponent
  },
  {
    path: 'tipoLogradouro',
    component: TipologradouroComponent
  },
  {
    path: 'tipoLogradouro/novo',
    component: TipologradouroFormComponent
  },
  {
    path: 'tipoLogradouro/alterar/:id',
    component: TipologradouroFormComponent
  }
];

Caso isso não funcione, tente trocar as rotas vazias ('') por uma string simples (como 'end') só pra ver se não resolve o problema.

Espero ter ajudado e boa sorte.

Obrogado, mas consegui resolver assim:

rota principal

import { Routes } from '@angular/router';

    import { FullComponent } from './layouts/full/full.component';
    import { AppBlankComponent } from './layouts/blank/blank.component';

    export const AppRoutes: Routes = 
    [
      {
        path: '',
        component: FullComponent,
        children: 
        [
          {
            path: '',
            loadChildren: './dashboards/dashboards.module#DashboardsModule'  
          },
          {
            path: 'configuracao',
            loadChildren: './paginas/configuracao/configuracao.module#ConfiguracaoModule'  
          },
          {
            path: 'arquivo',
            loadChildren: './paginas/arquivo/arquivo.module#ArquivoModule'  
          },
          {
            path: 'declaracao',
            loadChildren: './paginas/declaracao/declaracao.module#DeclaracaoModule'  
          },
          {
            path: 'parametro',
            loadChildren: './paginas/parametro/parametro.module#ParametroModule'  
          },
          {
            path: 'endereco',
            loadChildren: './paginas/endereco/endereco.module#EnderecoModule'  
          },
          {
            path: 'contribuinte',
            loadChildren: './paginas/banco/banco.module#BancoModule'  
          },
          {
            path: 'dashboard',
            loadChildren: './dashboards/dashboards.module#DashboardsModule'  
          }
        ]
      },
      {
        path: '',
        component: AppBlankComponent,
        children: 
        [
          {
            path: 'authentication',
            loadChildren: './authentication/authentication.module#AuthenticationModule'
          }
        ]
      },
      {
        path: '**',
        redirectTo: '404' 
      }
    ];

O problema era nas rota filha de usuário: estava assim:

    export const UsuarioRoutes: Routes = [
      {
        path: '',
        children: [
          {
            path: '',
            component: UsuarioComponent
          }
          , {
            path: 'novo',
            component: UsuarioFormComponent
          }, 
          {
            path: 'alterar/:id',
            component: UsuarioFormComponent
          }
          , 
          {
            path: 'banco/:id',
            component: UsuarioBancoFormComponent
          }
          , 
          {
            path: 'municipio/:id',
            component: UsuarioMunicipioFormComponent
          }
        ]
      }
    ]

Ficou assim:

 export const UsuarioRoutes: Routes = [
      {
        path: 'usuario',
        children: [
          {
            path: '',
            component: UsuarioComponent
          }
          , {
            path: 'novo',
            component: UsuarioFormComponent
          }, 
          {
            path: 'alterar/:id',
            component: UsuarioFormComponent
          }
          , 
          {
            path: 'banco/:id',
            component: UsuarioBancoFormComponent
          }
          , 
          {
            path: 'municipio/:id',
            component: UsuarioMunicipioFormComponent
          }
        ]
      }
    ]