Навигация в названной торговой точке

Question

Я пытаюсь перемещаться между компонентами внутри DialogBox, который отображает отдельную розетку.Поэтому моя главная проблема заключается в двух вещах:

1. Для работы именованных торговых точек их маршруты должны быть добавлены в app.module.ts (возможно, app.routing.ts).

2. Поскольку вторичный маршрут зависит от того, что пользователь изменяет, существует много компонентов, которые могут иметь место в первом загруженном компоненте.Вот почему я хочу использовать отложенную загрузку для загрузки этих компонентов, а не загружать их в начале в app.module.

Итак, что я уже пробовал, так это перемещаться относительно текущего маршрута, что частичноработает, но проблема в том, что маршрут найден, но компонент не начинает свой жизненный цикл.Предыдущий компонент «закрыт», а новый, который должен занять свое место, никогда не запускается, а экран пуст.

Итак, в моем app.module.ts я получил:

{
path: 'adjust',
loadChildren: 'src/app/components/adjust-panel/module/features.module#FeaturesModule',
outlet: 'modalOutlet',
    },

Ичтобы запустить эту навигацию, я просто использую:

    this.router.navigate([medicalObject.id], {
      relativeTo: this.route
    }).then(() => {
      this.router.navigate([{
        outlets: {
          modalOutlet: ['adjust']
        }
      }])
    })

Это запускает диалоговое окно через оболочку, которая выглядит следующим образом:

export class ModalContainerComponent implements OnDestroy {
    destroy = new Subject<any>();
    currentDialog = null;

    constructor(
        private dialog: MatDialog,
        private route: ActivatedRoute,
        private router: Router,
    ) {
        this.openDialog();

    }

    openDialog(): void {
        this.route.params.pipe(takeUntil(this.destroy)).subscribe(params => {
            console.log(params)

            const dialogRef = this.dialog.open(FeaturesModalComponent, {
                width: '95vw',
                height: '95vh'
            });
            dialogRef.componentInstance.medicalObject = params.id
            dialogRef.afterOpened().subscribe(() => {
            })
            dialogRef.beforeClosed().subscribe(() => {
                dialogRef.componentInstance.close()
            })

            dialogRef.afterClosed().subscribe(result => {

                this.router.navigate(['../'], { relativeTo: this.route })
            });
        })
    }


    ngOnDestroy() {
        this.destroy.next();
    }

Оболочка запускается и открывает диалоговое окно.Html-файл, в котором запускается этот модальный режим, просто получает внутри себя, поэтому, когда пользователь решает обновить страницу модальным режимом, он перезагружает и снова открывает модальный.

В моей оболочке есть какой-то html-файл, в котором вы можетеполучил это название розетки.Так что в модальном режиме я хочу показать что-то в начале, а когда пользователь выбирает опцию, я хочу запустить определенный компонент.Итак, я получил модуль, который я лениво загрузил:

const routes: Routes = [
    {
        path: '',
        component: AdjustPanelComponent,
        children: [
            {
                path: 'telesurgery',
                component: TelesurgeryComponent,
            }
        ],

    },
];

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

Эта маршрутизация является частью #FeaturesModule, который загружен правильно, потому что отображается первый компонент (AdjustPanelComponent).

, так что у вас есть URLвыглядит так, когда запускается localhost: 4200 /../../ medicalObject.id (modalOutlet: Adjust)

Когда я использую:

this.router.navigate(['telesurgery'], {
    relativeTo: this.route,
})

, я получаю и URL, как этот localhost:4200 /../../ medicalObject.id (modalOutlet: Adjust / Telesurgery)

ошибок нет, но компонент не запущен.

Поэтому я попробовал также это:

this.router.navigate([{ outlets: { modalOutlet: ['telesurgery'] } }],
      { skipLocationChange: true, relativeTo: this.route });

Таким образом, я получаю сообщение об ошибке Ошибка: Uncaught (в обещании): Ошибка: не может соответствовать ни один маршрут.Сегмент URL: «настроить»

и это:

   this.router.navigate([{
      outlets: {
        modalOutlet: 'telesurgery'
      }
    }]
      , {
        relativeTo: this.route
      }
    )

, что приводит к той же ошибке.

Есть причина для этого?Что я здесь не так делаю?