I have this file that mounts the menu.
import { Injectable } from '@angular/core';
export interface BadgeItem {
type: string;
value: string;
}
export interface Saperator {
name: string;
type?: string;
}
export interface ChildrenItems {
state: string;
name: string;
type?: string;
}
export interface Menu {
state: string;
name: string;
type: string;
icon: string;
badge?: BadgeItem[];
saperator?: Saperator[];
children?: ChildrenItems[];
}
const MENUITEMS =
[
{
state: 'dashboard',
name: 'Dashboard',
type: 'link',
icon: 'av_timer'
},
{
state: 'endereco',
name: 'Endereços',
type: 'sub',
icon: 'apps',
children: [
{state: 'pais', name: 'País'},
{state: 'estado', name: 'Estado'},
{state: 'bairro', name: 'Bairro'},
{state: 'logradouro', name: 'Logradouro'},
{state: 'tipoLogradouro', name: 'Tipo de logradouro'}
]
}
];
@Injectable()
export class MenuItems {
getMenuitem(): Menu[] {
return MENUITEMS;
}
}
The main route:
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: 'endereco',
loadChildren: './paginas/endereco/endereco.module#EnderecoModule'
}
]
},{
path: '',
component: AppBlankComponent,
children: [{
path: 'authentication',
loadChildren: './authentication/authentication.module#AuthenticationModule'
}]
},{
path: '**',
redirectTo: '404'
}];
The route to address:
import { Routes } from '@angular/router';
import { PaisComponent } from './pais/pais/pais.component';
import { PaisFormComponent } from './pais/pais-form/pais-form.component';
import { EstadoComponent } from './estado/estado/estado.component';
import { EstadoFormComponent } from './estado/estado-form/estado-form.component';
import { BairroComponent } from './bairro/bairro/bairro.component';
import { BairroFormComponent } from './bairro/bairro-form/bairro-form.component';
import { LogradouroComponent } from './logradouro/logradouro/logradouro.component';
import { LogradouroFormComponent } from './logradouro/logradouro-form/logradouro-form.component';
import { TipologradouroComponent } from './tipologradouro/tipologradouro/tipologradouro.component';
import { TipologradouroFormComponent } from './tipologradouro/tipologradouro-form/tipologradouro-form.component';
export const EnderecoRoutes: Routes = [
{
path: '',
children: [
{
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
}
]
}
];
After clicking the menu, mount the correct link route, but typing link , it shows wrong and misconfigured. According to images:
wrong
How do you just leave the correct one and enter the wrong one, does it show 404 error?