angular JavaScript not working in children component, left side nav dropdown is not working

49 views Asked by At

i have a left side navigation in home component, the navigation dropdown is not working in one of the routing module (admin-routing.module.ts). the navigation is working in app-routing.module.ts "path:'home'" the component file is same in the two routing modules

i am new in angular, i am using angular 14v

i have a component name with "home"

i used two routing

  1. app-routing.module.ts
  2. admin-routing.module.ts

This goes inside app-routing.module.ts

const routes: Routes =
  [
    { path: 'login', component: LoginComponent },
    { path: 'forgot-password', component: ForgotPasswordComponent },
    { path: 'not-found', component: NotFoundComponent },
    { path: '', redirectTo: 'login', pathMatch: 'full' },
    {
      path: 'admin',
      loadChildren: () =>
        import('./modules/admin/admin.module').then((m) => m.AdminModule)
    },
    {path:'home', component:HomeComponent},
    { path: '**', component: NotFoundComponent },
    
  ];

This goes inside admin-routing.module.ts

const routes: Routes = [
  {
    path: '',
    component: HomeComponent,
    children: [
      { path: '', redirectTo: 'dashboard', pathMatch: 'full'},
      { path: 'dashboard', component: DashboardComponent }
    ]
  }
];

i also added the script file path in angular.json

the navigation dropdown and toogle is not working in admin-routing.module.ts's "home path"

i hosted these files in my server

working navigation link is http://angular.byteinnovations.in/home

this navigation is not working http://angular.byteinnovations.in/admin/home

1

There are 1 answers

1
shubham sharma On

As i see in your routing

const routes: Routes = [

  {
    path: '',
    component:HomeComponent,
    children:
      [
        { path: '', redirectTo: 'home', pathMatch: 'full' },
        { path: 'home', component: HomeComponent }
      ]
  }
];

You are using HomeComponent two times can you check and do it in this way on your adminRouting Module

const routes: Routes = [
       
           
                { path: '', redirectTo: 'home', pathMatch: 'full' },
                { path: 'home', component: HomeComponent }
            
          
]