javascript - 在 Angular 5 中重新渲染(重新加载)路由器导出

标签 javascript angular typescript

我有 Angular 5 并且在重新渲染(重新加载)路由器导出时遇到问题。 我有一个链接 http://example.com/:unit/home/somethingElse。在 header 中,我有一个切换器来更改 unit。当它发生时,我需要从服务器检索新数据并将其放入页眉、主页和页脚(我在这些组件的 ngOnInit 中有 http 方法)。当我更改 unit (url) 时,数据保持不变。

我尝试使用: this.router.routeReuseStrategy.shouldReuseRoute = () => false; 它有效。 但每次我导航到其他页面时,它都会重新呈现我的页眉和页脚。

我知道我可以在 this.activatedRoute.params.subsribe() 中使用并将我所有的 http 方法放在那里,但是为了实现这个解决方法,我需要重写很多代码。

有没有办法在我需要的时候重新渲染(重新加载)特定的router-outlet?你能帮帮我吗。

最佳答案

如果使用 shouldReuseRoute = () => false 对你有效,那么一般的方法是创建自定义 RouteReuseStrategy。在 shouldReuseRoute 中,您可以检查相同路由组件的路由参数是否不同,如果是,则返回 false,即像这样:

if (future.component === curr.component) {
  if (curr.paramMap.keys.length) {
     const diff = curr.paramMap.keys.filter((key) =>
       curr.paramMap.get(key) !== future.paramMap.get(key));
     if (diff.length) { return false; }
  }
}

关于javascript - 在 Angular 5 中重新渲染(重新加载)路由器导出,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50646552/

相关文章:

angular - 将 WebView 添加到渐进式 Web 应用 (PWA)?

typescript - 为 npm 实用程序手动添加 TypeScript 类型

javascript - 为什么嵌套排序插件在 jquery 中不起作用?

Javascript 新日期输出错误的时间

javascript - 如何使用 jQuery/JS 单击没有 ID 的按钮

typescript - 不能表示非枚举值

javascript - json数据解析问题

javascript - Firebase:$保存到尚未创建的对象

javascript - Renderer2 在使用 d3 js 时不呈现 SVG 元素 - Angular 4

angular - Kendo UI TreeView 与复选框一起被锁定