cree dos componentes dentro de Angular entonces tengo dos archivos de modulos el archivo app.module llamo al archivo pages.module que tiene el resto de modulos.
app.module.ts
import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { HttpClientModule } from '@angular/common/http'; import { BrowserAnimationsModule } from '@angular/platform- browser/animations'; import { RouterModule, Routes } from '@angular/router'; import { MatMomentDateModule } from '@angular/material-moment-adapter'; import { MatButtonModule, MatIconModule } from '@angular/material'; import { TranslateModule } from '@ngx-translate/core'; import 'hammerjs'; import { FuseModule } from '@fuse/fuse.module'; import { FuseSharedModule } from '@fuse/shared.module'; import { FuseProgressBarModule, FuseSidebarModule, FuseThemeOptionsModule } from '@fuse/components'; import { fuseConfig } from 'app/fuse-config'; import { AppComponent } from 'app/app.component'; import { LayoutModule } from 'app/layout/layout.module'; import { SampleModule } from 'app/main/sample/sample.module'; const appRoutes: Routes = [ { path : '**', redirectTo: 'sample' }, { path : 'pages', loadChildren: './main/pages/pages.module#PagesModule' }
];
@NgModule({
declarations: [
AppComponent
],
imports : [
BrowserModule,
BrowserAnimationsModule,
HttpClientModule,
RouterModule.forRoot(appRoutes),
TranslateModule.forRoot(),
// Material moment date module
MatMomentDateModule,
// Material
MatButtonModule,
MatIconModule,
// Fuse modules
FuseModule.forRoot(fuseConfig),
FuseProgressBarModule,
FuseSharedModule,
FuseSidebarModule,
FuseThemeOptionsModule,
// App modules
LayoutModule,
SampleModule
],
bootstrap : [
AppComponent
]
})
export class AppModule
{
}
pages.module.ts
import { NgModule } from '@angular/core'; import { ProfileModule } from 'app/main/pages/profile/profile.module'; import { CrudexpedienteModule } from './expedientes/crud-expediente/crud-expediente.module'; @NgModule({ imports: [ // Profile ProfileModule, CrudexpedienteModule ] }) export class PagesModule { }
Pero no se que me falta para que me cargue la vista del componente en cuta organizacion la tengo asi:
Y el archivo navigation que es el encargado de dar la ruta de los hipervinculos a la izquierda
import { FuseNavigation } from '@fuse/types';
export const navigation: FuseNavigation[] = [
{
id : 'applications',
title : 'Applications',
translate: 'NAV.APPLICATIONS',
type : 'group',
children : [
{
id : 'sample',
title : 'Sample',
translate: 'NAV.SAMPLE.TITLE',
type : 'item',
icon : 'email',
url : '/sample',
badge : {
title : '25',
translate: 'NAV.SAMPLE.BADGE',
bg : '#F44336',
fg : '#FFFFFF'
}
},
{
id : 'profile',
title: 'Profile',
type : 'item',
icon : 'person',
url : '/pages/profile'
},
{
id : 'crud-expediente',
title: 'Expedientes',
type : 'item',
icon : 'person',
url : '/pages/expedientes/crud-expediente'
}
]
}
];
Cuando cargo el aplicattivo aparece asi
Pero cuando selecciono cualquiera de las paginas no me direcciona se queda ahi en esa.
RouterModule
? Así mismo, asegúrate que los elementos<a>
tengan el atributorouterLink
.