イベントで呼び出されたメソッドを介してクラス変数値またはクラスプロパティ値を変更する角度2タイプスクリプト

Question

私は角度2で新しいです。現在、通常他の言語で修正されている問題に直面しています。

以下のコードです。

import { 
    Component 
} from '@angular/core'; 

import { 
    registerEvent 
} from '../../utilities'; 

@Component({ 
    selector: 'mcs-slider-version2', 
    templateUrl: './slider-version2.component.html', 
    styleUrls: ['./slider-version2.component.scss'] 
}) 

export class SliderVersion2Component { 

    private _isDragActivated: boolean; 

    public constructor() {} 

    public mouseDown(): void { 
    console.log('down'); 
    this._isDragActivated = true; 
    registerEvent(this._element, 'mousemove', this._onMouseMove); 
    registerEvent(document, 'mouseup', this._mouseUp); 
    } 

    private _mouseUp(): void { 
    this._isDragActivated = false; 
    console.log(this._isDragActivate); 
    console.log('removed'); 
    } 

    private _onMouseMove(): void { 
    if (this._isDragActivated) { 
     // Do stuff 
    } 
    console.log(this._isDragActivated) 
    } 
} 

mousedownイベントが、それはまた、ユーザがそれが行く/に呼び出しますマウスを移動した場合に意味trueとしてプロパティ_isDragActivatedを設定しますDOM mousemoveとmouseup上の2つのイベントを登録します解雇たら基本的に、私の目標でありますメソッド_onMouseMove()したがって、基本的にはプロパティの値をコンソール_isDragActivated出力true場合は、ユーザーがマウスを離した場合、私はこのメソッドでmouseupを呼び出す/トリガーする_isDragActivatedとしてプロパティを設定し、再度私の期待されたマウスを移動しようとする私が設定してから出力はfalseですしかし、私はmouseupイベントをトリガした回数に関係なく、常に出力を得ています。true私は何かが恋しいですか？または間違ったアルゴリズムを実装しようとしていますか？

コンソール出力コード 上記

Answer 1

私は、ドキュメントにマウスアップイベントを登録しているときだと思います。 「this」はDOMを指し、SliderVersion2Componentは指しません。

私はあなたのSliderVersion2Componentにごthis._mouseUp機能を結合しようとするだろう...

registerEvent（文書 'のmouseup'、this._mouseUp.bind（この））;