클래스 변수 값 또는 클래스 속성 값이 작동하지 않는 이벤트에서 호출되는 메서드를 사용하여 각도 2 typescript

Question

저는 각도 2로 새롭습니다. 현재 다른 언어로 수정 한 문제가 있습니다.

아래 코드를 참조하십시오. mousedown 이벤트는 mousemove 및 mouseup 또한 사용자가이 갈 것입니다 마우스를 이동하면 true로 _isDragActivated 의미 속성을 설정합니다 /로 전화 DOM에 두 개의 이벤트를 등록합니다 해고 한 번

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) 
    } 
} 

는 기본적으로, 내 목표는 방법 _onMouseMove() 그래서 기본적으로 속성 값 _isDragActivated 출력 true을 콘솔합니다. 사용자가 마우스를 놓으면이 메서드에서 mouseup을 호출/트리거합니다. 속성 _isDragActivated을 false으로 설정하고 예상대로 마우스를 다시 이동하려고 시도합니다. 내가 설정 한 이후로 출력은 false입니다. on mouseup on event 얼마 전에 트리거되었지만 mouseup 이벤트를 몇 번이나 트리거했는지 상관없이 항상 출력이 있습니다. true. 내가 놓친 게 있니? 또는 잘못된 알고리즘을 구현하려고? 문서에 이벤트를 마우스를 등록 할 때 생각

Answer 1

위

콘솔 출력 코드. 'this'는 DOM을 나타내며 SliderVersion2Component는 참조하지 않습니다.

나는 당신의 SliderVersion2Component에 this._mouseUp 기능을 결합하려고 할 것입니다 ...

의 RegisterEvent (문서 '와 mouseUp', this._mouseUp.bind (이));