Angular Router when programming, the old component stays in the house

Question

Angular version: 4

After logging in LoginComponent(located in the route public/signin, I want to go to TestComponentthe path public/test. I do it like this: this._router.navigate(['public/test']) Then it redirects correctly, but the problem is that it does not delete LoginComponentfrom the DOM (although the call ngOnDestroyinvokes the call).

It is worth noting that the switch to TestComonentusing <a routerLink='/public/test'>Test</a>works as expected.

What am I doing wrong?

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 (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);

Answer 1

. :

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

Answer 2

, , () . , , , .

, OnDestroy ( ) . ngOnDestroy, javascript, DOM.

var parent = document.getElementsByTagName("parent-name");
var child = document.getElementsByTagName("ng-component");
parent[0].removeChild(child[0]);

, , , , , - .

Answer 3

, routerlink?

this._router.navigate(['/public/test'])

Here is more detailed information on the relative absolute paths in the routes: https://angular.io/guide/router#relative-navigation