TypeScript - 在事件监听器中保留作用域

Question

我是一个有用的助手，可以为您翻译文本。

我正在将我的AS3代码库转换成TypeScript，遇到了以下错误：

AS3代码：

private function loadDataXml(assetsXml : String) : void {
    var loader : URLLoader = new URLLoader();
    loader.addEventListener(Event.COMPLETE, handleDataLoaded);
    loader.load(new URLRequest(assetsXml));
}

private function handleDataLoaded(event : Event) : void {
    var xml_data : XML = new XML(event.target.data);
    parseData(xml_data);
    .........
}

private function parseData(xml_data : XML) : void {
    ......
}

TypeScript 代码

private loadDataXml(assetsXml : string) {
    var xmlRequest:XMLHttpRequest = new XMLHttpRequest();
    xmlRequest.addEventListener("load",this.handleDataLoaded, false);
    xmlRequest.open("GET", assetsXml, false);
    xmlRequest.setRequestHeader("Content-Type", "text/xml");
    xmlRequest.send(null);
}

private handleDataLoaded(evt:Event) {
    var xmlDoc:Document = (<XMLHttpRequest> evt.target).responseXML;
    this.parseXMLData(xmlDoc);
    ......
}

private parseData(xmlDoc:Document):void {
    ......
}

我遇到了这个错误 "Uncaught TypeError: Object # has no method 'parseData'"，原因是因为这行代码 xmlRequest.addEventListener......

我尝试使用箭头函数来修复它，但仍然无法解决（而且我认为我没有正确使用它）。

- user2694951

Answer 1

当您需要传递函数时，请使用新的 lambda 语法来处理成员变量（在 TypeScript 0.9.1 中引入）:

private loadDataXml(assetsXml : string) {
    var xmlRequest:XMLHttpRequest = new XMLHttpRequest();
    // you are passing a member function Use lambda to define this function: 
    xmlRequest.addEventListener("load",this.handleDataLoaded, false);
    xmlRequest.open("GET", assetsXml, false);
    xmlRequest.setRequestHeader("Content-Type", "text/xml");
    xmlRequest.send(null);
}

private handleDataLoaded = (evt:Event) => { // Since you want to pass this around  
    var xmlDoc:Document = (<XMLHttpRequest> evt.target).responseXML;
    this.parseXMLData(xmlDoc);  // you will get the correct this here 
    ......
}

private parseData(xmlDoc:Document):void {
    ......
}

- basarat

---

谢谢。这个可行。我尝试在addEventListener调用中使用箭头函数，但没有尝试在处理程序方法中使用它。 - user2694951

Answer 2

尝试绑定到作用域。

xmlRequest.addEventListener("load",this.handleDataLoaded.bind(this), false);

- MAHESH VALIYA VEETIL