angular2 observable.fromEvent vs按钮单击

Question

我有一些交替使用两者的代码 <button (click)="callsomefucntion" />和Observable.fromEvent<MouseEvent>(button.nativeElement.'click')

这两种方法有什么区别？我该什么时候去买另一个？

Answer 1

Observables方法更灵活。有许多功能可以与Observables一起使用。自己阅读documentation非常好。

如果您只想处理click并执行基本操作，只需使用按钮单击，但如果您需要使用click事件进行操作，并且您认为需要为该操作编写大量逻辑（示例：fire the event only after some time from previous one或merge您点击其他api calls并在显示标记之前对输入数据进行一些操作），首先查看Observables的文档，可能有方法可以帮助您实现逻辑实施。

应用三种方法时的执行顺序。

＆＃13;

＆＃13;

const button = $('#btn');

document.getElementById('btn').addEventListener('click', () => console.log('From pure callback'));

Rx.Observable.fromEvent(button, 'click')
.subscribe(() => console.log('From observable'));

button.on('click', () => console.log('From jQuery callback'));

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src='https://unpkg.com/@reactivex/rxjs@5.4.3/dist/global/Rx.js'></script>
<button id='btn'>Click</button>

＆＃13;

＆＃13;

＆＃13;