Почему каждый раз после создания компонента у меня есть ссылка на предыдущие данные?

Question

У меня есть компонент, который получает данные от службы по сообщению о событии:

this.objectDetailsSubscription = this.eventService.subscribe(
      EventsChannels.OBJECT_DETAILS,
      semantic => {
        this.layer = this.layerSemanticService.getObjectSemantic(semantic);
      }
    );

Где находится служба:

@Injectable({
  providedIn: "root"
})
export class LayersSemanticService {
  getObjectSemantic(semantic: LayerItemGeneric): ObjectInformationCustom {
    this.semantic = semantic;
    this.configuration = this.getConfigurationSemantic(semantic.layerIdCommon);

    return {
      buttons: this.getButtons(this.configuration),
    }

  }

    getButtons(configuration: LayerSemanticConfig) {
    configuration.tools = configuration.tools || [];
    configuration.tools.push(EButtonTypes.Pin);
    return configuration.tools; 
  }
}

В дочернем компоненте я передаю кнопки как Input ():

  *ngFor="let btn of buttons"

Я попытался сбросить переменную:

 ngOnInit() {
    this.layer = <ObjectInformationCustom>{};
}

Нет эффекта

Answer 1

Сервисы по умолчанию одиночные (если они отмечены @Injectable({ providedIn: 'root' }), как у вас).

Это означает, что существует один экземпляр, который живет в памяти в течение всего времени жизни приложения. Таким образом, состояние, которое существует внутри службы, будет одинаковым для всех компонентов, внедряемых вместе со службой, до тех пор, пока это состояние не изменится.

Если состояние не должно существовать после срока службы компонента, сохраните это состояние в компоненте. Если его необходимо сохранить и обновить в службе, обновите его в службе.

Можно настроить службы уровня компонентов, задав для них значение providers в декораторе @Component(). Однако этот подход следует использовать с осторожностью, поскольку он может привести к путанице.