Angular 2路由器,错误：无法激活已激活的插座

发布时间：2020-12-17 07:00:38 所属栏目：安全来源：网络整理

导读：我想我根本无法理解Angular 2路由.我在我的应用程序中有这个结构： const routes: Routes = [ { path: 'login',component: LoginViewComponent },{ path: 'main',component: MainComponent,children: [ { path: 'unit_list',component: ListViewComponent },

我想我根本无法理解Angular 2路由.我在我的应用程序中有这个结构：

const routes: Routes = [
    {
        path: 'login',component: LoginViewComponent
    },{
        path: 'main',component: MainComponent,children:
        [
            {
                path: 'unit_list',component: ListViewComponent
            },{
                path: 'unit_info',component: UnitInfoComponent,children:
                [
                    {
                        path: 'patient',component: PatientDetailsComponent
                    }
                ]
            }
        ]
    },{
        path: '',redirectTo: 'main',pathMatch: 'full'
    }
];

以下是我的app.module的样子：

@NgModule({
    imports: [
        BrowserModule,FormsModule,HttpModule,MainModule,routing
    ],declarations: [
        AppComponent,LoginViewComponent
    ],bootstrap: [AppComponent]
})

和main.module

@NgModule({
    imports: [
        CommonModule,RouterModule
    ],declarations: [
        ListViewComponent,MainComponent,PatientDetailsComponent,UnitInfoComponent,]
})

问题是我无法管理让router.navigateByUrl函数工作.

我在PatientDetailsComponent中有ngOnInit()函数,它检查患者是否为空,如果是,那么我称之为“this.router.navigateByUrl(”/ main / unit_info“)”,但它会在标题中抛出错误：“无法激活一个已经激活的插座“.它在Angular 2.1.1中运行良好,但是当我升级到2.4.X时似乎没有解决我的问题.我也不确定这条路由是否正确,因为我有点迷路.

这是我的整个路由在升级到2.4.X：http://pastebin.com/Y377STcW之前的样子

解决方法

这个错误可能是一个令人讨厌的红鲱鱼！

你会在Chrome控制台中看到类似的内容：

core.js:1440 ERROR Error: Uncaught (in promise): Error: Cannot
 activate an already activated outlet Error: Cannot activate an already
 activated outlet
     at RouterOutlet.activateWith (router.js:6676)
     at ActivateRoutes.activateRoutes (router.js:5765)
     at eval (router.js:5705)
     at Array.forEach (<anonymous>)
     at ActivateRoutes.activateChildRoutes (router.js:5704)

你会去检查你的路线和你的提供者和你的HTML,你不会发现任何错误.

然后突然间你会发生！

然后您将在控制台窗口中向上滚动.你会看到从屏幕顶部推出的真正错误：

core.js:1440 ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'foo' of null
TypeError: Cannot read property 'foo' of null

然后查找与您的组件对应的.ts文件,单击它,它将带您直接返回代码行并显示错误.

换句话说,路由器无法承受构建组件期间发生的错误. ngInit方法可能有不同的结果 – 尚未测试.在任何一种情况下,路由都很好:-)

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!