Question

我有一个应用程序，其中有我的父级路由，该路由重定向到加载整个视图的子级路由。在这里，我有许多组件可以从服务器获取数据并进行渲染。

基于某些条件，我将使用不同的参数重定向到父路由。子路由再次加载了传递给它的刷新数据。

parent ---> child -------------------Components getting data from Server ----
   <-----Different params------------

但是，在子路径中，某些组件仍在显示旧数据。通常，他们从服务器获取数据以进行渲染。

在我看来，它们在重新路由到父路由时并未被破坏，因此是使用旧数据而不是从服务器获取数据来呈现的。

关于可能是什么问题的任何建议？

编辑：

看来这不是问题。重新布线后，组件将被正确销毁。问题在于未重新创建的服务。

Relevant Question

Answer 1

当您导航至：

/showMeSomething/[id]

Angular知道此ID已更改，因此它重新加载了它的数据（ngOnInit）。但是当您的地址仍然是：

/showMeSomething

每次输入时它仍然是相同的地址。因此，没有新数据到达那里（没有ngOnInit）。

您使用某种方法使组件保持活动状态吗？

对此有一些复杂的解决方案：您必须为您的项目创建一个单例服务，并将其提供给父级和子级组件。在那儿添加一个布尔值，以定义是否要重新加载子数据。然后执行类似的操作：

navigateToChildComponent(){
  this.mySingleton.reload = true;
  this.router.navigate['blabla/mycomponent'];
}

然后添加一些ngDoCheck-它始终有效。

ngDoCheck(){
  if(this.mySingleton.reload){
    this.mySingleton.reload = false;
    this.getMyData();
  } 
}

但是，请仍然告诉我您是否使用某些方法使项目中的组件保持活动状态，以及如何使用它。

https://angular.io/guide/lifecycle-hooks#lifecycle-sequence

Answer 2

将不会重新创建服务，因为默认情况下它们是单例实例。

有关Angular的文档：

服务是注入器范围内的单例。在   给定注入器中最多一项服务实例。

只有一个根注入器，并且已注册UserService   用那个注射器。因此，只能有一个UserService   整个应用程序中的实例，以及注入UserService的每个类   获取此服务实例。

但是，Angular DI是一个分层注入系统，这意味着   嵌套的注入器可以创建自己的服务实例。角度的   始终创建嵌套的注入器

解决方案：

如果您确实要在每个组件中创建服务的新实例，则必须在组件定义时为它们声明一个提供程序。

@Component({
  selector: 'child2',
  templateUrl: './child2.component.html',

  // create a new instance of the service
  providers: [AngularService]
})

组件注入器彼此独立，并且彼此独立   创建自己的组件提供的服务实例。

...

当Angular销毁其中一个组件实例时，它也会   破坏部件的注射器和该注射器的服务   实例。

请参见以下示例，该示例说明了如何在Angular应用程序中注入服务：https://stackblitz.com/edit/angular-service-injecton-test

Angular文档：

https://angular.io/guide/dependency-injection#singleton-services

路由到父路由时销毁所有子组件

2 个答案:

解决方案：