Angular 5：防止在参数更改时重新加载组件

Question

我有一条路线/search，里面有两个组件；一个是带有结果的搜索框，另一个是应该在每个页面上的新闻源，与搜索无关。如果我执行搜索并将参数附加到 url，那么结果将出现在我的搜索框下方，但是在重新初始化页面/组件时，新闻源也会重新初始化，必须再次获取相同的数据（这很长运行任务）。

如何更新 url 以反映一个组件的状态变化，而不会重新呈现页面上的另一个组件？

angularjs 曾经有 reloadOnSearch: false 可以解决这个问题，虽然方式很草率

编辑：最好将返回的结果存储在 Service 中，然后在更改路线时，再次从服务中获取最后一个结果？如果是这样，如何做到这一点？

编辑：正如cgTag 所链接的那样。可以使用命名的出口。我没有看到任何内容代替插座的位置

app-routing.module.ts

const routes: Routes = [
  { path: 'search', component: SearchComponent },
  { path: 'view', component: ClientNewsFeedComponent, outlet: 'client-news-feed' }
]; 

search.component.html

<div>
  <cc-search-client-field></cc-search-client-field>
  <router-outlet name="client-news-feed"></router-outlet>
</div>

然后浏览到 url /search(client-news-feed:view) 路由器出口不会呈现任何内容

编辑：知道了。路由应该是

path: 'search', component: SearchComponent, children: [
  { path: 'view', component: ClientNewsFeedComponent, outlet: 'client-news-feed' }
]

并且url应该有一个/

/search/(client-news-feed:view)

Answer 1

您可能想要使用路由的outlet 功能。

https://angular.io/guide/router#displaying-multiple-routes-in-named-outlets

这允许您在不更改当前路由的情况下渲染 辅助 路由。然后，您将使用辅助路由来显示搜索结果。