未知のタイプエラー：this.deleteは関数ではありません

Question

import * as React from "react"; 
import $ = require("jquery"); 


export class Hello extends React.Component<{}, {}> { 
public delete() { 
    console.log("delete"); 
    $.ajax({ 
     type: "DELETE", 
     url: "http://127.0.0.1:8080/delete", 
     xhrFields: {withCredentials: true} 
    }).done((data: any): void => { 
     console.log("delete data:" + data); 
    }).fail((jqXHR: any): void => { 
     console.log("delete faildata: " + jqXHR.status); 
    }); 
} 


public save() { 
    console.log("save"); 
    $.ajax({ 
     type: "POST", 
     url: "http://127.0.0.1:8080/save", 
     dataType: "text", 
     crossDomain: true, 
     xhrFields: {withCredentials: true} 
    }).done((data: any): void => { 
     console.log("data:" + data); 
     {this.delete()} 
    }).fail((jqXHR: any): void => { 
     console.log(jqXHR); 
     console.log("faildata: " + jqXHR.status); 
    }); 
} 
render() { 
    return (
     <div> 
      <button onClick={this.delete}>delete</button> 
      <button onClick={this.save}>save</button> 
     </div> 
    ); 
} 
} 

コードを更新し、操作が完了したら保存をクリックします。データの削除を開始しますが、 がエラーになります。
enter image description here Hello.tsx：36 Uncaught TypeError：未定義のプロパティ 'delete'を読み取ることができません。私はTypeScript calling methods on class inside jquery function scopeの例を見ましたが、なぜ実行できないのでしょうか？

Answer 1

``済（）内

private save() { 
    console.log("save"); 
    $.ajax({ 
     type: "POST", 
     url: "http://127.0.0.1:8080/save", 
     dataType: "json", 
     crossDomain: true, 
     xhrFields: {withCredentials: true} 
    }).done((function (data) { 
     console.log("data:" + data); 
     this.delete(); 
    }).bind(this)).fail((function (jqXHR:any) { 
     console.log("faildata: "+jqXHR.status) 
     this.delete(); 
    }).bind(this)); 
}