Как перемещаться относительно от /info/123/step1 до /info/123/step2 внутри компонента с помощью Router без конкатенации строк и указания /info/123/?
Я добавил собственный ответ ниже. Пожалуйста, не стесняйтесь предлагать лучший ответ.;-) Я думаю, что есть лучшие подходы.
После нескольких исследований я столкнулся с
this.router.createUrlTree(['../step2'], {relativeTo: this.activatedRoute});
и
this.router.navigate(['../step2'], {relativeTo: this.activatedRoute});
Первый подход (Router.createUrlTree API) не работал у меня, т.е. ничего не происходило. Второй подход (Router.navigate API) работает.
Однако второй подход использует NavigationExtras (второй аргумент), который документирован с помощью @experimental. Надеюсь, что в следующем выпуске не будет больших изменений... и NavigationExtras будет стабильным.
Любые другие предложения/подходы, пожалуйста, не стесняйтесь отвечать на мой вопрос выше.
Обновление 2016-10-12
Существует еще один вопрос о стеке:
Обновление 2016-10-24
Документация:
Вы можете использовать ниже,
Предполагается, что questions загружается в ваш основной router-outlet
this.router.navigate([
'/',
{
outlets: {
primary: [
// below may be replaced with different variables
'questions',
'123',
'step2'
]
}
}
])
Надеюсь, это поможет!
Сначала вставьте маршрутизатор и ActivatedRoute в конструктор
constructor(private route:ActivatedRoute,private router:Router) { }
затем используйте для Click Event:
onEditClick(){
this.router.navigate(['edit'],{relativeTo:this.route});
Вы переходите к ожидаемой странице. В моем сценарии я хотел пойти рецепт /1, чтобы отредактировать рецепт. http://localhost:4200/recipes/1/edit