Лучшая практика Angular 4: загружать глобальные данные через сервис и сохранять их

Question

Я хочу создать угловое приложение, в котором я могу искать пользователя из базы данных и использовать информацию о человеке, которого я нашел на разных маршрутах. Моя проблема на данный момент заключается в том, что если я загружаю некоторые данные через службу, меняю маршрут и возвращаюсь, данные снова загружаются.

мой сервис:

import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/do';

@Injectable()
export class GlobalDataService {
cachedData: Observable<any>;

getData() {
    if (this.cachedData) {
      console.log('cache data found');
      return Observable.of(this.cachedData);
    } else {
      console.log('cache data NOT found');
      return this.http.get('https://56e05c3213da80110013eba3.mockapi.io/api/todos')
            .map(res => res.json())
            .do((data) => {
              this.cachedData = data;
            })
        .share();
    }
  }

мой компонент:

import { Component, OnInit } from '@angular/core';
import { FormBuilder, Validators} from '@angular/forms';
import { Http } from '@angular/http';
import { Observable } from 'rxjs';
import 'rxjs/add/operator/mergeMap';
import 'rxjs/add/operator/map';
import { GlobalDataService } from '../../services/global-data.service';
@Component({
   selector: 'app-dashboard',
   templateUrl: './dashboard.component.html',
   styleUrls: ['./dashboard.component.css'],
   providers: [GlobalDataService]
})
export class DashboardComponent implements OnInit {
   todos: Observable<any[]>;
   constructor(private globalDataService: GlobalDataService) { }
   ngOnInit() {
      this.globalDataService.getData().subscribe(
        (resp) => {
            this.todos = resp;
        }
    );
}}

когда я запускаю приложение, я получаю console.log "НЕ найден", и данные загружаются, как это и должно быть, но когда я меняю маршрут и переключаюсь обратно, он снова загружается, что неверно.

Я надеюсь, что вы можете помочь мне, возможно, с полным рабочим примером, чтобы я мог взглянуть на код. может я что-то упустил.

Если вам нужна дополнительная информация, не стесняйтесь спрашивать.

Answer 1

У вас есть услуга несколько раз? Вы должны зарегистрировать услугу только один раз.

Я вижу это в вашем компоненте Dashboard:

providers: [GlobalDataService]

Есть ли у вас в списке, как это в любом другом компоненте или модуле?

Чтобы поделиться услугой, она должна быть зарегистрирована только один раз:

• Либо в корне дерева компонентов (например, компонент приложения)
• ИЛИ в модуле вместо компонента.

Если вы зарегистрируете его несколько раз, он не будет работать как синглтон, и вы не получите общие данные.