Angular 4停止重新加载组件

Question

我希望我的组件稳定。它现在的工作方式是每次进入不同页面时重新加载。 但我希望它的工作方式是它不会重新加载。 你看到我在标题中有一个Marquee，并且它会重新加载页面。所以这不是很实用。

你可以看到蓝色的“标题”。它有一个类似滑块的新闻源，每次你去另一个页面时它会重新加载滑块。 所以我需要组件在进入不同的页面时停止重新加载。

----------------- UPDATE ---------------

html的代码

    <div class="row page-header">
  <div class="col-sm-3 align-left"><img class="customer-logo" [src]="_DomSanitizationService.bypassSecurityTrustUrl('data:image/jpg;base64,'+ kioskservice.getLogo())"/></div>
  <div class="col-sm-6 align-center"><marquee direction="left" scrollamount="5" behavior="scroll">{{translationservice.getExpression("Appointment.AddEdit_PostalCodeServiceError")}}</marquee></div>
  <div class="col-sm-3 align-right"><i class="far fa-clock"></i>{{ clockservice.time | date:"HH:mm" }}</div>
</div>

组件调用页面的方式

<page-header></page-header>

Answer 1

您没有提供任何代码，因此我猜您有一个基本应用，app.component.html中有一个<router-outlet>。

这样做的目的是，只要您的应用程序收到新路由，Angular路由器就会在RouterModule.forRoot(....)

找到app.module中具有匹配路由条目的组件。

以这种方式渲染的任何组件，如果路径发生变化并且加载了不同的组件，则会被销毁。

您可以做些什么来阻止这种情况：

1. 将组件直接插入app.component 。这样它将始终显示 - 您将不会使用路由器插座。标头已在app.component.html中修复。如果仍需要在某些路径上隐藏它，可以使用*ngIf和一些基本服务隐藏它。
2. 将该组件插入另一个router

<强>更新 所以你的app.component.html看起来像这样：

<some random tags>
    <router-outlet></router-outlet>
</some random tags>

将其更改为：

<some random tags>
    <your-header-tag-name></your-header-tag-name>
    <router-outlet></router-outlet>
</some random tags>

您可以从app.component.ts

中使用@ViewChild访问它