Question

我有以下架构：

UiControlsModule
|- Component 1
|- Component 2

模块1在 SharedModule 中导入和导出。

CasesModule
|- CaseListComponent
|- // several other components

将SharedModule导入CasesModule。

现在，在CaseListComponent中我有一个组件1的实例（UiControlsModule）：

<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时，我也可以看到它上面没有订阅者（数组为空）。

我认为，这是因为它从一个模块转到另一个模块，但不知道如何解决它。

非常感谢任何帮助：）

@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。您可以在处理程序方法声明中（在组件类定义中）调用它。

试试这样：

<强> template.html

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

（而不是）

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

<强>打字稿

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

Output（）不发出事件

1 个答案: