在 Angular 6 中，如果路由相同，我将无法再次加载该组件

Question

如果路由相同但 parent 组件中的数据已更改，我将无法再次加载组件。我有 route.ts 上面写了所有路由假设一个组件的 /module/{name} 我只更改 parent 组件中的数据但是路由是相同的如何处理这种情况

在 parent 组件中，我在 api 成功调用 parent 组件

后导航到路由

this.Service.updateInfo(res['Info']);   
this.router.navigate([routeUrl] ,{relativeTo: this.route });

并在 child 中使用 router-outlet 呈现并使用

获取数据表单服务

this.selected = this.Service.InfoData;

服务文件

 public updateInfo(data) {
    if(data) {
      this.InfoData = data;
    }
  }

但是一旦路线相同，child 就不会从服务中获取更新数据。

Answer 1

尝试使用您的路由配置进行以下设置

RouterModule.forRoot(routes, { 
  // ...
  onSameUrlNavigation: 'reload', 
  // ...
});

export class YourComponent {
  constructor(private router: Router) { 
    this.router.routeReuseStrategy.shouldReuseRoute = () => false;
  }
}

注意这可能对性能影响不大。

Answer 2

您可以使用 BehaviorSubject 发出数据，并使用 angular 服务将数据从一个组件检索到新组件。在你的情况下你需要这样..

InfoData = new BehaviourSubject<any>([]); 
  // inside your service

从子组件订阅InfoData，需要更改数据时使用

this.InfoData.next(data)  //and it will gives data.

In Angular 6 I am not able to load that component again if the route is same