2016-04-28 3 views
1

в соответствии с настоящим руководством: Parent and children communicate via a serviceУгловых 2 - Shared Service подписка

Я Тринг использовать общую службу в качестве альтернативы EventEmitter, поскольку EventEmitter общается только между родителем и ребенком компонентом. В моей ситуации это не так, но оба компонента используют один и тот же сервис (MasterdataService).

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

MasterdataService

import {Injectable} from 'angular2/core'; 
import {Subject} from 'rxjs/Subject'; 

@Injectable() 
export class MasterdataService { 

    private _updateAnnouncedSource = new Subject<string>(); 
    updateAnnounced$ = this._updateAnnouncedSource.asObservable(); 

    announceUpdate(value: string) { 
     console.log('announcement to update list has been triggered'); 
     this._updateAnnouncedSource.next(value); 
    } 
} 

MasterdataComponent (оповещающее обновление)

@Component({ 
    providers: [MasterdataService] 
}) 
export class MasterdataComponent { 

    constructor(private masterdataService: MasterdataService) {} 

    newMerchant(merchantIdInput: HTMLInputElement, merchantNameInput: HTMLInputElement) {  
     this.masterdataService.announceUpdate('newMerchant'); 
    } 
} 

MasterdataListComponent (подписка на Субъекта)

@Component({ 
    providers: [MasterdataService] 
}) 
export class MasterdataListComponent { 

    subscription:Subscription; 

    constructor(private masterdataService:MasterdataService) { 

     this.subscription = this.masterdataService.updateAnnounced$.subscribe(
     value => { 
      console.log('update announcement received... updating list with value ', value); 
      this.merchants = this.masterdataService.getAllMerchants(); 
     }) 
    } 
} 
+0

Увидеть больше кода делает это проще, если вы задаетесь вопросом, почему я не ответил ранее, но сделаю здесь :) –

+0

Вы проверили, что 'newMarchant' на самом деле вызван, а также называется ** после ** подписки? –

+0

просто добавил ответ и поставил вопрос более очевидным, чтобы увидеть ошибку (декораторы компонентов). –

ответ

0

Моя проблема была не в коде, а в том, как я использую/объявляю Сервис в своих компонентах. Определив эту услугу в обоих компонентах декоратора

@Component({ 
    providers: [MasterdataService] 
}) 

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

Поскольку у меня есть корневой компонент (AppComponent), я могу объявить услугу в этом декораторе, а угловой - заботиться обо всем остальном (DI a.k.a Injection of Dependency Injection), предоставляя службу в качестве аргумента в конструкторе обоих классов компонентов.

Смежные вопросы