Angular2 router 2.0.0 не перезагружает компоненты, когда тот же URL-адрес загружен разными параметрами?

У меня есть это в моем файле .routing.ts

export const routing = RouterModule.forChild([
{
    path: 'page/:id',
    component: PageComponent
}]);

Мой файл PageComponent проверяет параметр id и соответственно загружает данные. В предыдущих версиях маршрутизатора, если бы я перешел из /page/ 4 в/page/25, страница "перезагрузилась" и компоненты обновились.

Теперь, когда я пытаюсь перейти на /page/X, где X - это id, он только когда-либо загружается в первый раз, тогда url изменяется, но компоненты не перезагружаются снова.

Есть ли что-то, что нужно передать, чтобы перезагрузить мои компоненты и вызвать событие ngOnInit?

Ответы

Ответ 1

обновление 2

Этот ответ предназначен только для давно прекращенной версии маршрутизатора.

См. https://angular.io/api/router/RouteReuseStrategy для того, как это сделать в текущем маршрутизаторе.

обновление 1

Теперь исправлено (Angular 2.3) для нового маршрутизатора https://github.com/angular/angular/pull/13124, что позволяет обеспечить пользовательскую стратегию повторного использования.

В качестве примера см. также https://www.softwarearchitekt.at/post/2016/12/02/sticky-routes-in-angular-2-3-with-routereusestrategy.aspx

оригинальный

https://github.com/angular/angular/issues/9811

Это известная проблема. В настоящее время нет способа заставить маршрутизатор повторно создать компонент для изменения параметров только для параметра.

Они обсудили планы внедрения некоторых стратегий повторного использования в конечном итоге.

Вы можете подписаться на изменения параметров и выполнить свой код там вместо ngOnInit()

Ответ 2

с Angular 7.2, router 7.2 вы можете сделать следующее.

constructor(
    private router: Router
) {
    this.router.routeReuseStrategy.shouldReuseRoute = function(){
        return false;
    }  
}

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

Вы можете прочитать больше о стратегиях повторного использования маршрута здесь

Ответ 3

Этот код работает как для angular 2, так и для 4. вам необходимо подписать параметр, как показано ниже

selected_id:any;
constructor(private route: ActivatedRoute) { }
ngOnInit() 
{
    this.route.params.subscribe(params => {
    this.selected_id = params['id']; 
    });
}

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

ngOnDestroy()
{
 this.selected_id.unsubscribe();
}

это будет ясно предыдущее значение параметра

над логикой работает для меня. надеюсь, что это поможет вам.

[Info]
var selected_id = this.route.snapshot.paramMap.get('id');
//earlier i was used this code to get param value,it works when navigate from 
//different page but not in the same page reload