Question

在我问我的问题之前，这是我的Typescript类：

export class Info {

    private currentId: number;

    private addToListButton: HTMLInputElement;

    constructor() {
        this.currentId = +(<HTMLInputElement> document.getElementById("Example")).value;

        this.addToListButton = <HTMLInputElement> document.getElementById("addToList");

        this.registerEvents();
    }

    private registerEvents(): void {
        this.addToListButton.addEventListener("click", (() => this.addToList()));
    }

    private addToList(): void {
        var data: SomeModel;
        data.id = this.currentId;

        // ajax stuff
    }
}

我的问题是，当我想获取模型的“ currentId”时，它始终是未定义的。我可以在同一函数中使用另一个变量“ addToListButton”，而不会出现问题。

我看不到那里是什么问题。

感谢您的帮助！

Answer 1

在此处调用函数this时，函数addToList中的关键字Info不引用类this.addToListButton.addEventListener("click", (() => this.addToList()));的实例。

要让this引用实例，请使用箭头功能：

private const addToList = (): void => { // Arrow function
  var data: SomeModel;
  data.id = this.currentId;

  // ajax stuff
}

Here是关于什么箭头功能的一些解释。

Answer 2

在addToList()方法中，关键字this是指事件上下文，而不是Info对象上下文。

要以这种方式使用，您需要将方法绑定到类。将此添加到构造函数中：

this.addToList = this.addToList.bind(this);

在函数中调用变量时始终未定义

2 个答案: