Sebelum saya sampai pada pertanyaan saya, inilah kelas TypeScript saya:
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
}
}
Masalah saya adalah ketika saya ingin mendapatkan "currentId" untuk model, selalu tidak terdefinisi. Variabel lain "addToListButton" dapat saya gunakan dalam fungsi yang sama tanpa masalah.
Saya tidak bisa melihat apa masalahnya di sana.
Terima kasih atas bantuan Anda!
2 jawaban
Kata kunci this dalam fungsi addToList tidak merujuk ke instance kelas Info saat fungsi dipanggil di sini this.addToListButton.addEventListener("click", (() => this.addToList()));.
Agar this merujuk ke instance, gunakan fungsi panah:
private const addToList = (): void => { // Arrow function
var data: SomeModel;
data.id = this.currentId;
// ajax stuff
}
Berikut beberapa penjelasan tentang fungsi panah adalah.
Dalam metode addToList(), kata kunci this mengacu pada konteks peristiwa bukan konteks objek Info.
Untuk menggunakan cara ini, Anda harus mengikat metode ke kelas. Tambahkan ini ke konstruktor:
this.addToList = this.addToList.bind(this);