RxJS fromEvent运算符,在Angular中输出EventEmitter

Question

说有ChildComponent哪个会发出一个叫做的事件someEvent.很显然,我能赶上事件ParentComponent声明一样,<child-component (someEvent)="onSomeEvent($event)"></child-component>并且该方法处理它onSomeEvent的ParentComponent.但我正在尝试的是,我想fromEvent在RxJS中使用运算符处理事件.我试图fromEvent(this.childComponent.nativeElement, 'someEvent')获得后ElementRef的ChildComponent用@ViewChild.我发现如果输出EventEmitter的事件名称与其中一个本机事件相同click但上面没有响应/工作,则上述方法有效.有没有办法让它合作fromEvent？

Answer 1

如果要将事件转换为observable,可以使用a Subject,如下所示:

@Component({
  selector: 'parent-component',
  template: `
    <child-component (someEvent)="subject.next($event)">
    </child-component>
  `
})
export class ParentComponent {
  public subject = new Subject<any>();
  constructor() {
    this.subject.pipe(
      tap(event => console.log(event)) // or whatever
    ).subscribe();
  }
}

这样做会为您提供一个可观察的来源 - 主题 - 它会发出事件发射器发出的任何值.从那里你可以使用RxJS运算符组合你想要的任何东西.