Как повторно использовать макет angular для sidemenu, header, content и footer

Question

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

Я использую следующую структуру кода:

  core.component.html:
            <div id="contextWrap">
              <!-- Header -->
              <router-outlet name="header"></router-outlet>
              <!-- Header End -->
              <!--sidebar-->
              <router-outlet name="sidemenu"></router-outlet>
              <!--sidebar end-->

              <!--maincontent-->
              <div class="ui equal width left aligned padded grid stackable">
                <router-outlet name="content"></router-outlet>
              </div>
              <!--maincontent end-->
   <!-- Footer -->
              <router-outlet name="footer"></router-outlet>
   <!-- Footer end-->
            </div>
    app.component.html
    <router-outlet></router-outlet>

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