出力（）イベント

Question

発光ない私は、次のアーキテクチャがあります。

UiControlsModule 
|- Component 1 
|- Component 2 

モジュール1は、インポートおよびSharedModuleにエクスポートされます。

CasesModule 
|- CaseListComponent 
|- // several other components 

SharedModuleはCasesModuleにインポートされます。

は今、CaseListComponentの内側に私は（UiControlsModuleの）部品1のインスタンスを持っている：

<cre-question-group 
    (valueChanged)="catchValueChange(question)"> 
</cre-question-group> 

私はコンポーネント1で定義されている、ここでの値の変更をキャッチしようとしている：

@Output() valueChanged = new EventEmitter<Question>(); 

someMethod(question: Question) { 
    this.valueChanged.emit(question); 
} 

メソッドsomeMethod()が呼び出され、イベントが発生します。しかし、私は私のCaseListComponentでイベントをキャッチすることはできません。 valueChangedを調べると、加入者がいないこともわかります（配列は空です）。

1つのモジュールからもう1つのモジュールに移動しているためだと思いますが、解決方法がわかりません。

すべてのヘルプは大歓迎です:)

@Update： は、それが別のモジュールの構成要素ですので、それが機能しないことは可能ですか？通常はうまくいくはずですか、間違っていますか？

@Update 2：

今私は、被写体や、観察を介して通信メッセージサービスとそれを実装しようとしましたが、いくつかの奇跡の理由で、これは同様に動作しません。 は、ここで私はそれを実装する方法は次のとおりです。

質問-group.component.ts：

catchValueChange(question: Question) {  

    this.messagesService.sendComponentChangeEvent(question); 
} 

messages.service.ts：

@Injectable() 
export class MessagesService { 

    constructor() { } 

    // Observable string sources 
    private componentChangeEvent = new Subject<Question>(); 

    // Observable string streams 
    componentValueChanged$ = this.componentChangeEvent.asObservable(); 

    // Service message commands 
    sendComponentChangeEvent(question: Question) { 
     this.componentChangeEvent.next(question); // <-- breakpoint reaches this point as expected. After, nothing happens - and there's no observer on componentChangeEvent. 
    } 
} 

場合、list.component。 html：

ngOnInit() { 

    // watch for changes on edit of the components 
    this.subscription = this.messagesService.componentValueChanged$.subscribe((question: any) => { 
     console.log(question.id + " (" + question.type + "): " + question.selection); 
    }); 

テンプレートではObservableを購読しますが、それは決してその点に達しません。私はエラーがmessages.service.tsのどこかにあると仮定しますか？ 開発コンソールにエラーが表示されません。

Answer 1

テンプレートイベントハンドラ関数のパラメータはとする必要があります$eventと呼びます。ハンドラメソッドの宣言（コンポーネントクラス定義内）で好きなものを呼び出すことができます。

テンプレート：

は次のように試してみてください。（代わりの）HTML

<cre-question-group (valueChanged)="catchValueChange($event)"></cre-question-group> 

<cre-question-group 
    (valueChanged)="catchValueChange(question)"> 
</cre-question-group> 

typescriptです

catchValueChange(question: Question) { 
    console.log('question', question); 
}