Angular Router以编程方式导航时，旧组件留在dom中 [英] Angular Router when navigating programatically, old component stays in the dom

问题描述

角度版本:4

从LoginComponent(位于public/signin路径中)登录后，我想导航到路径public/test中的TestComponent. 我这样做如下:this._router.navigate(['public/test']) 然后，它可以正确重定向，但问题是它没有从DOM中删除LoginComponent(尽管ngOnDestroy确实被调用了).

After signing in from the LoginComponent (located in public/signin route, I want to navigate to TestComponent in the path public/test. I'm doing so as following: this._router.navigate(['public/test']) Then, it redirects correctly but the problem is that it doesn't remove LoginComponent from the DOM (although ngOnDestroy does get called).

值得一提的是，使用 <a routerLink='/public/test'>Test</a>可以正常工作.

It's worth mentioning that navigating to TestComonent using <a routerLink='/public/test'>Test</a> works as expected.

我在做什么错了?

app.routing.ts:

app.routing.ts:

const APP_ROUTES:Routes = [
  {path: 'public', loadChildren: './authentication/authentication.module#AuthenticationModule'}
];

export const APP_ROUTING:ModuleWithProviders = RouterModule.forRoot(
APP_ROUTES, {
useHash: false, enableTracing: true, initialNavigation: true});

` authentication.routing.ts(这两个组件都在其中):

` authentication.routing.ts (where both of these components belong):

const routes: Routes = [
    {
        path: '',
        children: [
            {path: 'test', component: TestComponent},
            {path: 'signin', component: LoginComponent},
        ]
    }
];

export const routing = RouterModule.forChild(routes);

推荐答案

我遇到了同样的问题. 我通过在路由之前添加此代码来解决此问题:

I have a same problem. I fixed by add this before routing:

this.zone.run(() => {
    // Your router is here
    this._router.navigate(['public/test'])
});

这篇关于Angular Router以编程方式导航时，旧组件留在dom中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！