Angular router-outlet откладывает рендеринг компонентов

Я разрабатываю приложение Angular 6, мое обычно показывает компоненты, связанные с маршрутом. Но при загрузке страницы (при перезагрузке Ctrl+R/F5) происходит задержка загрузки компонентов;

<div [loading]="loading">
  <app-header></app-header>
  <div id="pageContentWrapper">
    <router-outlet (activate)="onActivate($event)"></router-outlet>
  </div>
  <app-footer></app-footer>
</div>

Вот мой код; app-header и app-footer отображаются мгновенно, но задерживают рендеринг. Любые идеи, почему это задерживает рендеринг?


angular router router-outlet
person KoboldMines    schedule 31.03.2019    source источник
comment
Можете воспроизвести на stackblitz.com?   -  person alt255    schedule 31.03.2019
comment
@alt255 Боюсь, я не могу воспроизвести это, я бродил, были ли какие-либо теории о задержке рендера router-outlet   -  person KoboldMines    schedule 31.03.2019
comment
Что такое [loading]? Это какая-то директива?   -  person Josef Katič    schedule 31.03.2019
comment
[загрузка] означает, что пока переменная загрузки имеет значение true, страница загружается, никаких действий предпринять нельзя. когда загрузка ложная, анимация загрузки отключается   -  person KoboldMines    schedule 03.04.2019

Ответы (1)


arrow_upward
0
arrow_downward

Довольно сложно получить помощь без предоставленного кода, важные биты не включены в ваш пост. Тем не менее, я собираюсь рискнуть... похоже, что вы пытаетесь сделать экран загрузки для функции, но делаете это неправильно.

  ngOnInit() {
    this.router.events.subscribe(event => {
      if (event instanceof RouteConfigLoadStart) {
        // siteLoading(true);
      } else if (event instanceof RouteConfigLoadEnd) {
        // siteLoading(false);
      }
    });
  }
person Community    schedule 31.03.2019