NativeScript Angular: как перенаправить дочерний вложенный маршрут? - PullRequest
0 голосов
/ 01 января 2019

Я использую NativeScript Angular и не могу понять, как настроить представление по умолчанию для использования children вложенного маршрута.

Самый простой способ передать то, что я пытаюсь выполнитьэто посмотреть на мою игровую площадку здесь: https://play.nativescript.org/?template=play-ng&id=WvQnzu&v=581

Откройте app/home/home-routing.module.ts и в строке 9 вы увидите, где я пытаюсь перенаправить исходный вид страницы для загрузки дочернего компонента firstв <router-outlet>, определенном в home.component.html

Я могу загрузить дочерний компонент во вложенном <router-outlet>, нажав кнопку ИЛИ с помощью програматического this.routerExtensions.navigate() (см. home.component.ts строка 47)

Что я делаю не так?Почему при начальной загрузке HomeComponent дочерний элемент FirstComponent не отображается во вложенном <router-outlet> ??

Я просто хочу использовать эту пользовательскую вкладку навигации и загрузитькомпонент, когда щелкают по элементу навигации по вкладке.

Дополнительный кредит: Я вижу outlet, используемый в маршрутах, а также это фанковое /<route>(<outlet>:<route>) именованное обозначение розетки.Пример: [modal-navigation-ng] e2e app 1 .Эта запись / механизм задокументирована где-нибудь?Я вроде понимаю, что происходит, но похоже на какой-то черный ящик / магию.Я не могу полностью понять концепцию, просто взглянув на пример приложения e2e

1 Ответ

0 голосов
/ 01 января 2019

Несколько уровней абсолютного перенаправления не поддерживаются Angular.

Источник: https://github.com/angular/angular/issues/25254

Простое решение - использовать относительное перенаправление

app-маршрутизация

const routes: Routes = [
    { path: "home", loadChildren: "./home/home.module#HomeModule" },
    { path: "", redirectTo: "home", pathMatch: "full" }
];

домашняя маршрутизация

const routes: Routes = [
    {
        path: "", component: HomeComponent,
        children: [
            { path: 'first', component: FirstComponent },
            { path: 'second', component: SecondComponent },
            { path: '', redirectTo: 'first', pathMatch: 'full'}
        ]
    }
];
...