Angular 2 服务 - 每当我更改路线时都会清除数据？答案

【问题标题】：Angular 2 services - data cleared out whenever I change routes?Angular 2 服务 - 每当我更改路线时都会清除数据？
【发布时间】：2017-02-28 08:40:58
【问题描述】：

我有一个 Angular 2 单页应用程序，所有内容都是从同一页面上的一个或组件特定模板呈现的，但是当我在导航栏上使用 this.router.navigate 或 routerLink 来绕过我的应用程序时，每次它都会清除取出我存储在我的服务中的数据，特别是一组 JSON 对象，它再次呈现一个组件并执行它的 ngOnInit 来检查服务中是否有数据，因为没有它再次从数据库。我希望这些数据保持不变，这样客户端就不会每 2 秒访问我的服务器以获取相同的数据，我如何在不使用 localStorage 的情况下实现这一点？延迟加载会这样做吗？

【问题讨论】：

标签： angular angular2-routing angular2-services

【解决方案1】：

您需要在@NgModule(...) export class AppModule() 或导入到AppModule 的模块中提供服务，使其成为全局并与应用程序具有相同的生命周期。

如果你在组件中提供服务，那么服务的生命周期随着组件的生命周期结束。

【讨论】：

你的意思是这样吗？因为我已经有了它：@NgModule({ declarations: [...stuff], imports: [... stuff ], providers: [EventService, AuthService], bootstrap: [AppComponent] }) export class AppModule { }跨度>
这就是我的意思。这样什么都不会被清除。您是否也在@Component({providers: [...]} 中提供EventService 或AutService？
不只是在主 app.module.ts 中，然后导入服务并将其注入到我的@component 的构造函数中：constructor(private eventService: EventService) {}
那我猜是你的一些代码清除了这个值。我怀疑 Angular 本身正在做这样的事情。也许你可以在 Plunker 中复制

【解决方案2】：

尝试使用 Singleton 共享服务。然后使用getter、setter方法访问数据

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

@Injectable()
export class SharedStoreService {
    static instance: SharedStoreService;
    private jsonArray:any =[];

    constructor(){
       return SharedStoreService.instance = SharedStoreService.instance || this;
    }

    setJsonArray(list){
       this.jsonArray = list;
    } 
    getJsonArray(){
       return this.jsonArray;
    }
}

【讨论】：

当 Angular 提供开箱即用的自定义“单例”模式时，您为什么要实现它？
而不是使用静态关键字，只是将服务用作常规的 Angular 2 服务。在组件中注入服务后，使用 getter 和 setter 访问变量。
我已经将它用作注入到我的组件中的服务，但是当 http 订阅从我的组件中返回类似 this.eventService.eventsArray = this.events 的数据时，我直接在组件中设置它。那是问题吗？它是否指向我的组件中超出更改路由范围的数组？
我在我的组件中尝试了这个，它导入了我的服务 this.eventService.fetchData().subscribe(data => { this.eventService.setEvents(data); 但数组仍然每次都被清除我使用路线。