Question

我是angular的新手，我尝试构建一个小型应用程序。我有一个拥有变量和函数的服务：

data.service.ts

childMethod() {
  this.message = 'child value';
}

我也有两条路线：

app.module.ts（服务在此处定义）

data=[];
getData(){
   this.http.get(url).subscribe((res)=>
   this.data.push(res));
};

当我在homeComponent中使用getData函数时，它工作正常，并将响应添加到数据数组。但是-这是问题所在-一旦我导航到第二条路线，服务中的数据就会返回为空数组。

当我导航时，我会认为该服务不会“重新启动”。

那是什么问题？谢谢。

Answer 1

当您移动到其他路线时，所有本地数据都将被删除并使用默认值初始化。因此，如果要保留data以便在其他页面中使用，则必须将这些值保存在全局声明的变量中。

要声明可在所有页面中使用的全局变量，请首先创建一个global.service.ts文件，然后将该文件导入所有组件。无论何时何地，您都可以this.global.variableName的形式访问这些全局变量。

遵循link的步骤创建全局服务。

将代码更改为

创建全局服务后，将该全局服务导入到app.module.ts中，然后在home.component.ts中将其导入

import { GlobalService } from '../global.service';
.
.
.constructor(public global: GlobalService) { }
.
.
getData(){
    this.http.get(url).subscribe((res)=>
    this.global.globalData.push(res);
};

Answer 2

问题是从另一个方向找到并解决的。

我使用<a href="/">作为路由的链接，这可能导致应用程序在每次单击时都会重新启动。 <a routerlink="/">解决了这个问题。

更改路线时为什么不保存服务中的数据？

2 个答案: