错误:未激活(承诺)：错误:无法激活已激活的出口

Question

我用的是角8

我的路由定义如下

app-routing.module.ts

const appRoutes: Routes = [
  {
    path: '',
    loadChildren: () => import('./@shared/layouts/dashboard-layout/dashboard-layout.module').then(m => m.DashboardLayoutModule)
  },
  {
    path: '',
    loadChildren: () => import('./@shared/layouts/auth-layout/auth-layout.module').then(m => m.AuthLayoutModule),
  },
  {path: '404', component: NotFoundComponent},
  {path: '**', redirectTo: '/404'}
];

@NgModule({
  imports: [RouterModule.forRoot(appRoutes)],
  exports: [RouterModule]
})
export class AppRoutingModule {}

DashboardLayoutModule ->仪表板-layout.routing.ts

const routes: Routes = [
  {
    path: '', redirectTo: 'qr/create', pathMatch: 'full',
  },
  {
    path: 'qr', redirectTo: 'qr/create', pathMatch: 'full'
  },
  {
    path: '', component: DashboardLayoutComponent, children: [
      {
        path: 'settings', loadChildren: () => import('../../../views/settings/settings.module').then(m => m.SettingsModule),
        canActivate: [AuthGuardService]
      },
      {
        path: 'qr/create', loadChildren: () => import('../../../views/create-qr/create-qr.module').then(m => m.CreateQrModule)
      },
      {
        path: 'qr/create/:id/', loadChildren: () => import('../../../views/create-qr/create-qr.module').then(m => m.CreateQrModule)
      },
      {
        path: 'qr', loadChildren: () => import('../../../views/designer/designer.module').then(m => m.DesignerModule)
      },
      {
        path: 'qr', loadChildren: () => import('../../../views/qr/qr.module').then(m => m.QrModule)
      },
      {
        path: 'analytics', loadChildren: () => import('../../../views/analytics/analytics.module').then(m => m.AnalyticsModule),
        canActivate: [AuthGuardService]
      },
      {
        path: 'leads', loadChildren: () => import('../../../views/leads/leads.module').then(m => m.LeadsModule),
        canActivate: [AuthGuardService]
      },
      {
        path: 'profile', loadChildren: () => import ('../../../views/profile/profile.module').then(m => m.ProfileModule),
        canActivate: [AuthGuardService]
      },
      {
        path: 'support', loadChildren: () => import ('../../../views/support/support.module').then(m => m.SupportModule)
      },
      {
        path: 'subscription', loadChildren: () => import ('../../../views/subscription/subscription.module').then(m => m.SubscriptionModule),
        canActivate: [AuthGuardService]
      }
    ]
  },
];

@NgModule({
  imports: [
    RouterModule.forChild(routes)
  ]
})
export class DashboardLayoutRouting {
}

当生产建立在本地，甚至在开发中，一切都很好。但是在生产服务器上，导航不能正常工作并导致错误。

ERROR Error: Uncaught (in promise): Error: Cannot activate an already activated outlet
Error: Cannot activate an already activated outlet
    at vn.activateWith (main-es2015.8496fab846e7208312ae.js:formatted:38396)
    at _e.activateRoutes (main-es2015.8496fab846e7208312ae.js:formatted:36807)
    at main-es2015.8496fab846e7208312ae.js:formatted:36766
    at Array.forEach (<anonymous>)
    at _e.activateChildRoutes (main-es2015.8496fab846e7208312ae.js:formatted:36765)
    at _e.activateRoutes (main-es2015.8496fab846e7208312ae.js:formatted:36811)
    at main-es2015.8496fab846e7208312ae.js:formatted:36766
    at Array.forEach (<anonymous>)
    at _e.activateChildRoutes (main-es2015.8496fab846e7208312ae.js:formatted:36765)
    at _e.activate (main-es2015.8496fab846e7208312ae.js:formatted:36711)
    at o.project (main-es2015.8496fab846e7208312ae.js:formatted:37865)
    at o._next (main-es2015.8496fab846e7208312ae.js:formatted:38949)
    at o.next (main-es2015.8496fab846e7208312ae.js:formatted:717)
    at l._next (main-es2015.8496fab846e7208312ae.js:formatted:42254)
    at l.next (main-es2015.8496fab846e7208312ae.js:formatted:717)
    at o._next (main-es2015.8496fab846e7208312ae.js:formatted:38953)
    at o.next (main-es2015.8496fab846e7208312ae.js:formatted:717)
    at c.notifyNext (main-es2015.8496fab846e7208312ae.js:formatted:31944)
    at i._next (main-es2015.8496fab846e7208312ae.js:formatted:538)
    at i.next (main-es2015.8496fab846e7208312ae.js:formatted:717)
    at o._next (main-es2015.8496fab846e7208312ae.js:formatted:38953)
    at o.next (main-es2015.8496fab846e7208312ae.js:formatted:717)
    at t._subscribe (main-es2015.8496fab846e7208312ae.js:formatted:39462)
    at t._trySubscribe (main-es2015.8496fab846e7208312ae.js:formatted:22325)
    at t.subscribe (main-es2015.8496fab846e7208312ae.js:formatted:22317)
    at s.call (main-es2015.8496fab846e7208312ae.js:formatted:38936)
    at t.subscribe (main-es2015.8496fab846e7208312ae.js:formatted:22317)
    at o (main-es2015.8496fab846e7208312ae.js:formatted:30375)
    at c._innerSub (main-es2015.8496fab846e7208312ae.js:formatted:31927)
    at c._next (main-es2015.8496fab846e7208312ae.js:formatted:31919)
    at c.next (main-es2015.8496fab846e7208312ae.js:formatted:717)
    at c.notifyNext (main-es2015.8496fab846e7208312ae.js:formatted:31944)
    at i._next (main-es2015.8496fab846e7208312ae.js:formatted:538)
    at i.next (main-es2015.8496fab846e7208312ae.js:formatted:717)
    at o._next (main-es2015.8496fab846e7208312ae.js:formatted:38953)
    at o.next (main-es2015.8496fab846e7208312ae.js:formatted:717)
    at l._next (main-es2015.8496fab846e7208312ae.js:formatted:42254)
    at l.next (main-es2015.8496fab846e7208312ae.js:formatted:717)
    at c.notifyNext (main-es2015.8496fab846e7208312ae.js:formatted:512)
    at i._next (main-es2015.8496fab846e7208312ae.js:formatted:538)
    at i.next (main-es2015.8496fab846e7208312ae.js:formatted:717)
    at o._next (main-es2015.8496fab846e7208312ae.js:formatted:38953)
    at o.next (main-es2015.8496fab846e7208312ae.js:formatted:717)
    at w._complete (main-es2015.8496fab846e7208312ae.js:formatted:35438)
    at w.complete (main-es2015.8496fab846e7208312ae.js:formatted:725)
    at H._complete (main-es2015.8496fab846e7208312ae.js:formatted:739)
    at H.complete (main-es2015.8496fab846e7208312ae.js:formatted:725)
    at c._complete (main-es2015.8496fab846e7208312ae.js:formatted:508)
    at complete (main-es2015.8496fab846e7208312ae.js:formatted:725)
    at t._subscribe (main-es2015.8496fab846e7208312ae.js:formatted:39463)
    at v (polyfills-es2015.7cc86a7ad57851d5c4e3.js:1)
    at v (polyfills-es2015.7cc86a7ad57851d5c4e3.js:1)
    at polyfills-es2015.7cc86a7ad57851d5c4e3.js:1
    at a.invokeTask (polyfills-es2015.7cc86a7ad57851d5c4e3.js:1)
    at Object.onInvokeTask (main-es2015.8496fab846e7208312ae.js:formatted:12546)
    at a.invokeTask (polyfills-es2015.7cc86a7ad57851d5c4e3.js:1)
    at s.runTask (polyfills-es2015.7cc86a7ad57851d5c4e3.js:1)
    at _ (polyfills-es2015.7cc86a7ad57851d5c4e3.js:1)

<router-outlet></router-outlet>在两个文件中

• app.component.html
• dashboard-layout.component.html

Answer 1

所需更改:-

DashboardLayoutModule ->仪表板-layout.routing.ts

const routes: Routes = [
  {
    path: '', component: DashboardLayoutComponent, children: [
      {
         path: '', redirectTo: 'qr/create', pathMatch: 'full',
      },
      {
         path: 'qr', redirectTo: 'qr/create', pathMatch: 'full'
      }
      {
        path: 'settings', loadChildren: () => import('../../../views/settings/settings.module').then(m => m.SettingsModule),
        canActivate: [AuthGuardService]
      },
      {
        path: 'qr/create', loadChildren: () => import('../../../views/create-qr/create-qr.module').then(m => m.CreateQrModule)
      },
      {
        path: 'qr/create/:id/', loadChildren: () => import('../../../views/create-qr/create-qr.module').then(m => m.CreateQrModule)
      },
      {
        path: 'qr', loadChildren: () => import('../../../views/designer/designer.module').then(m => m.DesignerModule)
      },
      {
        path: 'qr', loadChildren: () => import('../../../views/qr/qr.module').then(m => m.QrModule)
      },
      {
        path: 'analytics', loadChildren: () => import('../../../views/analytics/analytics.module').then(m => m.AnalyticsModule),
        canActivate: [AuthGuardService]
      },
      {
        path: 'leads', loadChildren: () => import('../../../views/leads/leads.module').then(m => m.LeadsModule),
        canActivate: [AuthGuardService]
      },
      {
        path: 'profile', loadChildren: () => import ('../../../views/profile/profile.module').then(m => m.ProfileModule),
        canActivate: [AuthGuardService]
      },
      {
        path: 'support', loadChildren: () => import ('../../../views/support/support.module').then(m => m.SupportModule)
      },
      {
        path: 'subscription', loadChildren: () => import ('../../../views/subscription/subscription.module').then(m => m.SubscriptionModule),
        canActivate: [AuthGuardService]
      }
    ]
  },
];

@NgModule({
  imports: [
    RouterModule.forChild(routes)
  ]
})
export class DashboardLayoutRouting {
}