Аурелия - Динамическое перенаправление в детском маршруте

У меня есть приложение Aurelia, родительский и дочерний маршрутизатор. родитель:

{ name: 'group', route: 'group/:groupId', viewPorts: {
    Filter: { moduleId: 'filter.js'},
    Content: { moduleId: 'content.js' }
}}

Дочерний маршрутизатор настроен:

[
    { name: 'home',      route: ''          },
    { name: 'documents', route: 'documents' },
    { name: 'images',    route: 'images'    },
    { name: 'specs',     route: 'specs'     }
]

Дочерний маршрутизатор настроен в content.js, Я хотел бы добиться, чтобы в родительском маршрутизаторе я перемещался без указания полного пути childs

router.navigateToRoute('group', { groupId: 12345 });

В дочернем роутере это закончится home где я бы выполнил динамическое перенаправление на основе некоторого состояния приложения. Как это должно быть достигнуто? До сих пор я пробовал эти

С RedirectToRoute:

activate(params: any, config: any, instruction: NavigationInstruction): any {
    return new RedirectToRoute('pick one child route');
}

впрыскивать Router:

@inject(Router)
export class Home {
    constructor(router: Router) {
        this.router = router;
    }
    activate(params: any, config: any, instruction: NavigationInstruction): void {
        this.router.navigateToRoute('pick one child route');
    }
}

Само перенаправление / навигация верны локально, однако baseUrl (дочернего) маршрутизатора по-прежнему указывает на старый (родительский) маршрут, поэтому результат будет неверным.

Например: мы на странице: group/98765/images и в родительском маршрутизаторе мы перемещаемся: router.navigateToRoute('group', { groupId: 12345 });, Как и ожидалось, мы закончим group/12345 а также home "s activate метод будет уволен.

Мы перенаправим сюда, скажем, specs, Но вместо group/12345/specs мы окажемся в group/98765/specs из-за устаревших baseUrl,

Как это должно быть исправлено?

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

1 ответ

Решение

Хотя события маршрутизатора будут работать, но это не элегантно, так как две навигации произойдут и появятся в истории браузера. Если пользователь пытается вернуться назад, он / она не может, потому что возвращается назад к home маршрут, который сразу же перейдет к выбранному дочернему маршруту.

"Правильный" путь (в документации Aurelia): используйте обратный вызов navigationStrategy при настройке маршрутизатора. Вот как настроить дочерний маршрутизатор:

configureRouter(config: RouterConfiguration, router: Router) {
    const navStrat = (instruction: NavigationInstruction) => {
        instruction.config.redirect = 'pick one child route';
    };
    config.map([
        { name: 'redirecter', route: '',         navigationStrategy: navStrat },
        { name: 'documents',  route: 'documents'                              },
        { name: 'images',     route: 'images'                                 },
        { name: 'specs',      route: 'specs'                                  }    
    ]);
}

Это приведет к одному циклу навигации, и можно реализовать любую логику динамического перенаправления.

Другие вопросы по тегам