угловой метод вызова компонента 4 при перенаправлении на него - PullRequest
0 голосов
/ 10 ноября 2018

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

До сих пор я пытался реализовать интерфейсы AfterContentChecked и AfteViewChecked с их соответствующими методами ngAfterContentChecked и `ngAfterViewChecked. Единственная проблема с реализацией одного из этих интерфейсов состоит в том, что метод вызывается несколько раз при маршрутизации к компоненту, и это проблема производительности для меня.

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

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

Ответы [ 3 ]

0 голосов
/ 10 ноября 2018

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

СОВЕТ: Отфильтруйте события с помощью instanceof NavigationEnd

0 голосов
/ 10 ноября 2018

В принципе вы можете добавить inject Router в качестве зависимости и затем подписаться на events. Существует список events, который предоставляет маршрутизатор.

Поскольку мы заботимся только о событии NavigationEnd, вы можете отфильтровать его с помощью оператора filter.

Данные события имеют свойство url, которое можно использовать для сравнения с путем, достигнутым после NavigationEnd

this.router.events
.pipe(
  filter(event => event instanceof NavigationEnd)
)
.subscribe((event: any) => {
  console.log('Got the Event URL as '. event.url);
})

Вот Образец StackBlitz для вашей ссылки.

0 голосов
/ 10 ноября 2018

Всякий раз, когда происходит маршрутизация, создается компонент и вызывается функция ngOnInit.

export class TestComponent implements OnInit{
  constructor(){
     //called first time before the ngOnInit()
  }

  ngOnInit(){
     //called after the constructor
  }
}

Другие два варианта, которые у нас есть -

  1. Resover - resolve функция

  2. Gaurds - canActive функция

Resolver и Gaurd выполняются при изменении маршрутизации.

...