typescript - 変更イベントとクラスオブジェクト変数でテキストエリアを使用する方法は?

Question

class のオブジェクトがあり、コンストラクターで最初にゼロに設定されたTextManager数値があります。テキスト領域が変更されるたびに、オブジェクトの変数xxを更新できるようにしたいと考えています。xx

class Drawer {
    canvasElement: HTMLCanvasElement;
    constructor(_canvasElement: HTMLCanvasElement) {
        this.canvasElement = _canvasElement;
    }
    drawCircle(x:number,y:number,radius:number,color:string) {
        var ctx = this.canvasElement.getContext("2d");
        ctx.beginPath();
        ctx.arc(x, y, radius, 0, 2 * Math.PI);
        ctx.fillStyle = color;
        ctx.closePath();
        ctx.fill();
    }
}

var canv;
var drawer;
var d = 0;
var textAreaElement;
var textManager;

class TextManager{
    textAreaElement: HTMLAreaElement;
    xx: number;
    constructor(_textAreaElement: HTMLAreaElement) {
        this.textAreaElement = _textAreaElement;
        this.xx = 0;
        this.textAreaElement.onchange = this.update;
    }

    update() {
        this.xx += 10;
        if (this.xx > 50) this.xx = 0;
        drawer.drawCircle(95 + this.xx, 50, 40, "#FF0000");

    }
}

window.onload = () => {
    canv =  <HTMLCanvasElement>document.getElementById("myCanvas");
    drawer = new Drawer(canv);
    textAreaElement = <HTMLAreaElement>document.getElementById("codeArea");
    textManager = new TextManager(textAreaElement);
};

問題は、コードでこの方法を使用すると、xx = NaN. メンバーにアクセスしているのではなく、クラス内の関数にアクセスしているだけです。

xxイベントが発生するたびにオブジェクトを更新するにはどうすればよいですか?