如何將按鈕點擊動作鏈接到TypeScript代碼？

Question

使用JavaScript，你通常做處理按鈕點擊：

<button id="myButton" onclick="myClickHandler">Click!</button> 

其中的JavaScript代碼，你必須：

function myClickHandler { /* some action */ } 

在我的打字稿的代碼，我有一個應用程序類MyApp的（在MyApp的.TS）：

class MyApp 
{ 
    myClickHandler() { /* some action */ } 
} 

，我有這個在我的主要main.ts文件：

let myApp = new MyApp(); 

我想引用對myApp在按鈕的onclick聲明，但不工作：

<button id="myButton" onclick="myApp.myClickHandler">Click!</button> 

當我明確地聯繫起來的事件處理程序的代碼，它的工作原理：

document.getElementById("myButton").onclick =() => { myApp.myClickHandler(); } 

所以，我的問題是：如何在HTML代碼中將按鈕單擊事件處理程序連接到MyApp類實例的成員函數？

（我知道，我也許應該使用一個框架，這些事情，我會繼續前進後來才反應過來，但我希望得到這個權利第一）

Answer 1

這基本上是確定的，但我會：

• 沒有使用let爲一個全局變量（myApp）

• 定義myClickHandler作爲箭頭的功能（就像在你的onClick覆蓋）

  class MyApp { 
      myClickHandler =(): void => { /* some code */ } 
  }