Rotas no angular 2 - resolvido

Front-end JavaScript
#1

Tenho um sistema com estas rotas.

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: 'arquivo',
        loadChildren: './paginas/arquivo/arquivo.module#ArquivoModule'  
      },
      {
        path: 'declaracao',
        loadChildren: './paginas/declaracao/declaracao.module#DeclaracaoModule'  
      },
      {
        path: 'usuario',
        loadChildren: './paginas/usuario/usuario.module#UsuarioModule'  
      },
      {
        path: 'parametro',
        loadChildren: './paginas/parametro/parametro.module#ParametroModule'  
      },
      {
        path: 'endereco',
        loadChildren: './paginas/endereco/endereco.module#EnderecoModule'  
      },
      {
        path: 'municipioIntegrado',
        loadChildren: './paginas/municipio-integrado/municipio-integrado.module#MunicipioIntegradoModule'  
      },
      {
        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' 
  }
];

Quando entro no sistema http://localhost:4200/#/, ele não vai para a página correta que é http://localhost:4200/#/dashboard

no lugar de

 {
        path: 'dashboard',
        loadChildren: './dashboards/dashboards.module#DashboardsModule'  
      }

já tentei assim

 {
        path: '',
        loadChildren: './dashboards/dashboards.module#DashboardsModule'  
      }

Aonde estou errando ?

#2 
{ 
        path: '',
        pathMatch: 'full', 
        loadChildren: './dashboards/dashboards.module#DashboardsModule'  
}
#3

@jonathan.sky, não funcionou.

#4

http://localhost:4200/#/ ou http://localhost:4200/
acessou dessa maneira, certo?

#5

isto

#6

Saquei,

 {
    path: '',
    pathMatch: 'full',
    redirectTo: 'dashboard'
  }

 {
    path: 'dashboard',
    loadChildren: './dashboards/dashboards.module#DashboardsModule'  
  }
#7

Não funcionou.

Está mostrando no console do navegador

[WDS] Warnings while compiling.

Duplicated path in loadChildren detected during a rebuild. We will take the latest version detected and override it to save rebuild time. You should perform a full build to validate that your routes don’t overlap.

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

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

export const AppRoutes: Routes = 
[
   {
    path: '',
    pathMatch: 'full',
    redirectTo: 'dashboard'
   },
  {
    path: '',
    component: FullComponent,
    children: 
    [
      {
        path: 'arquivo',
        loadChildren: './paginas/arquivo/arquivo.module#ArquivoModule'  
      },
      {
        path: 'declaracao',
        loadChildren: './paginas/declaracao/declaracao.module#DeclaracaoModule'  
      },
      {
        path: 'usuario',
        loadChildren: './paginas/usuario/usuario.module#UsuarioModule'  
      },
      {
        path: 'parametro',
        loadChildren: './paginas/parametro/parametro.module#ParametroModule'  
      },
      {
        path: 'endereco',
        loadChildren: './paginas/endereco/endereco.module#EnderecoModule'  
      },
      {
        path: 'municipioIntegrado',
        loadChildren: './paginas/municipio-integrado/municipio-integrado.module#MunicipioIntegradoModule'  
      },
      {
        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' 
  }
];
#10

Duplicated path in loadChildren detected during a rebuild. Ele está indicando que tem dois caminhos com mesmo endereço

#11

Obrigado @jonathan.sky

Foi resolvido. O problema eram as sub rotas.

1 curtida
#12

Pode mandar como ficou a solução?

#13

Lógico:

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
      }
    ]
  }
]
1 curtida
#14

Opa, Boa! Go Go para o próximo desafio

#15

Acho que ele estava confundindo a rota com subrota.