Angular2でonmouseupイベントを使用すると、ネイティブ動作が上書きされます

Question

現在、angular2とtypescriptを使用してアプリケーションを開発中です。 コントロールを送信するために範囲スライダ入力を使用する必要があり、入力が使用されているとき、つまりユーザーがドラッグしているときを知る必要があります。

"mouseup"と "mousedown"イベントの組み合わせを試しました。 スライダをクリックすると、 "mousedown"イベントがトリガされ、 "isActive"変数がtrueに設定されます。スライダの使用を停止すると、mouseupイベントが発生し、isActive変数がfalseに設定されます。一部は完璧に動作しますが、私は「のmouseup」イベントに行うためのアクションを設定しているという事実は、ネイティブのアクションを上書きするために見て、スライダーが解放されないことを

<input type="range" (mousedown)="isActive = true" (mouseup)="isActive = false" /> 

。ここで

は挙動を示す簡単なplunkerです：https://plnkr.co/edit/PJqFp7dFREog9rE7Shdx

は、この作業をするために必要な機能を実装していないこと、それは私ですか？またはイベントを伝播せず、それらを上書きするangle2の「バグ」ですか？

ありがとうございます。

Answer 1

https://plnkr.co/edit/KMmJVMhbnmdjVha92S5S?p=preview

私はこの方法であなたのisActive assignationsをラッピングして、あなたのコードの作品を​​作りました。 plnkrを見てください。

あなたは

isActive = true 

を行うときには、trueを返し、イベントバブリングを続けるために動作が異なる理由はあります。 そして、あなたは

isActive = false 

を行うときにはfalseを返し、バブリングからイベントを防ぎます。

Answer 2

これを行う方法が見つかりました。私はこのような「のmouseup」イベントで$event.propagate()を追加します。

<input type="range" (mousedown)="isActive = true" (mouseup)="isActive = false;$event.propagate();" /> 

が、私はそれが正しく動作するためにそれを行う必要があること、通常のでしょうか？イベントがangular2によって自動的に伝播されるべきではないか？