Компоненты Angular2 (финальная версия) не могут обмениваться данными через наблюдаемые в сервисе

Question

Я использую Angular v2.1Я пытаюсь заставить компоненты отправлять сообщения через общий сервис.

Я хочу сначала отправить данные из первого компонента company.component.ts ко второму компоненту modal.component.ts,

Я не знаю точно, где проблема (если это происходит при отправке или получении данных). Когда я отлаживаю полученные данные, я обнаружил объект подписчика:

Subscriber {closed: false, syncErrorValue: null, syncErrorThrown: false, syncErrorThrowable: false, isStopped: false…}

в modal.service.ts:

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

@Injectable()
export class ModalService {
  private sharedCompanySource = new Subject<string>();

  sharedCompany = this.sharedCompanySource.asObservable();

  getCompany(){
    return this.sharedCompany;
  }

  setCompany(_company: any){
    this.sharedCompanySource.next(_company);
  }
}

в первом компоненте company.component.ts:

import { ModalService }  from './modals/modal.service';
@Component({
    templateUrl: 'company.component.html',
    providers: [
        ModalService
    ]
})
export class CompanyComponent implements OnInit {
  constructor(private missionService: ModalService) {
     this.missionService.setCompany("hellooooooooooooooo");
  }
}

во втором компоненте modal.component.ts:

import { ModalService }  from './modals/modal.service';
import { Subscription }         from 'rxjs/Subscription';
@Component({
    templateUrl: 'modal.component.html',
    providers: [
        ModalService
    ]
})
export class ModalComponent implements OnInit {
  subscription:Subscription;
  constructor(private missionService: ModalService) {
     this.subscription = missionService.sharedCompany.subscribe();
  }
}

Answer 1

Оба компонента объявляют

providers: [
    ModalService
]

Таким образом, они не разделяют сервис. Оба имеют свой отдельный экземпляр ModalService. Для этого и нужны провайдеры.

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

Обратите внимание, что вы также не передаете обратный вызов subscribe()Таким образом, ничего не произойдет, когда они начнут использовать один и тот же сервис.