如何在不重新加载整个页面的情况下重新加载组件

Question

我想重新加载路线，但不重新加载整个页面。这不是我想要的:

window.location.reload();

我只想重新加载组件而不是页面。这是我尝试过的：

1. Angular：无需重新加载即可更改路线
2. Angular：在同一 URL 导航上重新获取数据

我还尝试过其他一些随机技巧。尝试从此 URL 中获取以下代码：

1. Angular 基础知识：刷新 Angular 组件而不重新加载同一组件

   mySubscription: any;
   
   constructor() {
     this.router.routeReuseStrategy.shouldReuseRoute=function() {
       return false;
     }
   
     this.mySubscription= this.router.events.subscribe((event)=> {
       if(event instanceof NavigationEnd) {
           // Trick the Router into believing it's last link wasn't previously loaded
           this.router.navigated=false;
       }
     })
   }
   

但是由于其他原因它不起作用。我需要一个解决方案。请建议其他东西。

Answer 1

skipLocationChange选项对我有用，试试我的服务

import { Injectable } from '@angular/core';
import { Router } from '@angular/router';

@Injectable()
export class ReloadRouteService {

  constructor(
    private router: Router,
  ) { }

  redirectTo(url: string): void {
    // When skipLocationChange true, navigates without pushing a new state into history.
    this.router.navigateByUrl('/', {skipLocationChange: true}).then(() => {
        this.router.navigate([url]);
    });
  }
}

Answer 2

当我搜索这个时我需要的是

runGuardsAndResolvers: 'always'

在路线声明中。

如本答案所述：https://stackoverflow.com/a/56254921/17183210

或者这个博客：https://medium.com/engineering-on-the-incline/reloading-current-route-on-click-angular-5-1a1bfc740ab2