Угловая ошибка обнаружения изменения маршрутизатора ПЕРЕД маршрутом - изменение

Question

У меня есть ленивые загруженные компоненты, и я хочу показать прелоадер, когда мы загружаем компоненты компонента/thirdparty library и т. Д. С сервера.

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

Также я хочу, чтобы не включать в каждый компонент службу загрузчика и, во многих случаях, скрывать загрузчик на ngOnInit (например). Теперь я пытаюсь сделать это на высшем уровне (app.js)

Но я не знаю, как, потому что

Во-первых: Не знаю, как правильно определить попытку изменить маршрутизатор и шоу-загрузчик (теперь я сделать это очень уродливо - просто огонь, когда мы нажимаем на ссылку навигации .... и это плохо, потому что, когда я пытаюсь перемещаться по методам программирования - загрузчики не будут показаны). Может быть, существует какой-то способ обнаружения изменений до того, как маршрутизатор отобразит новый компонент?

Я видел: topic 1topic 2 router.subscribe (путь => {/ скрыть Загрузчик действие /}) ​​

не работает правильно, потому что
1: он работает после того, как компонент рендеринга и пожаров только тогда, когда все компоненты материал будет загрузиться, я хочу показать загрузчик перед загрузкой. 2: когда componentnet загружен, и мы пытаемся перемещаться между компонентами и возвращать на загруженный компонент - эта подписка будет запущена немедленно. Таким образом, это означает, что после того, как мы вернемся к запатентованному компоненту, первое подписное устройство будет выпущено после этого - загрузчик будет показан :) и никогда не будет скрыт. Я не знаю, почему (потому что на какой-то компонент не router.next уволят и отписки не будет срабатывать

есть мой код

private showPreloader() { 
    let a; 
    this._loadingService.controlledLoaderShow(); 

    a = this._router.subscribe((val) => { 
     console.log("Hide preloader"); 
     this._loadingService.controlledLoaderHide(); 

     a.unsubscribe(); 
    }, 
     (err) => {console.log(`Error in app.ts showPrealoder ${err}`)}); 



    } 

Answer 1

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

о том, как передать данные в общую службу см https://github.com/angular/angular/issues/4112 (Это будет или уже изменилось в маршрутизаторе версий RC.x) углам главного.