你如何得到一个观察事件？

Question

我想知道你如何在Angular 2中获得一个Observable事件？

例如，我想订阅点击事件但只在两次点击后发出？是否可以获得MouseClick事件对象的Observable？

如果我想按button或ctrlKey进行过滤，或者按KeyboardEvent进行过滤，并按key \ keyCode过滤 - 或任何可能的未来方案

我已阅读http://blog.thoughtram.io/angular/2016/01/06/taking-advantage-of-observables-in-angular2.html，但valueChanges属性为Observable<string>

我在https://github.com/angular/angular/issues/5489上也看到过可以做的事情：

this.clickStream = new Subject();
...
<button (click)="clickStream.next($event)">Click Me</button>

Subject方法高于正确的方法吗？我不确定。

我对Angular 2或RxJS没有多少经验，但我对两者都感兴趣并且正在调查他们在未来的项目中使用它们的想法

修改

这是我的Plunker，只有一个简单的点击用例http://plnkr.co/edit/u1A7ve2fAYigjwaZ0x1v?p=preview

Answer 1

Observable有一个fromEvent operator，但要使用它，你需要一个对原生元素的引用。获得它的方法是使用viewChild / contentChild来获取elementRef。

接下来你可以像这样绑定它的点击：

var clickStream = Observable.fromEvent(btnRef.nativeElement, 'click');

如果我正确理解了过滤内容，您希望只有在按下两次点击后才会发出流，或者更准确地说，每次点击两次就会发出一次，为此，请使用bufferWithCount operator：< / p>

var triggerFor2Clicks = clickStream.bufferWithCount(2);

这将一次发出一个包含2个事件的数组，因此您的操作处理程序可以是：

triggerFor2Clicks.subscribe(() => my2ClicksHandler);

请注意，参数为空，标注为＆＃39;（）＆＃39;因为你并不真正关心这些事件，只是因为它们是其中的两个。