在事件處理程序中使用$（this）與typescript

我在stackoverflow中看到很多回答錯誤的答案，我想至少爲自己弄清楚。老問題：在事件處理程序中使用$（this）和typescript。大部分答案都是關於使用的event.target

第一個問題是它不僅是event.target（堆棧溢出中的大部分答案）。我也需要檢查IE的具體條款（任何記得jQuery之前至少知道這一點的人）。

第二個問題是傳播。讓說我有這樣的

<a href="#"><i class="fa fa-open"><span>something is here</span></i></a>

一些元素和我a這樣創造了一個click事件：

$("a").click((evt)=>{ 
    evt = evt || window.event; 
    var target = evt.target || evt.srcElement; 
    console.log($(target)); 
});

如果有足夠的空白和邊距周圍的正確點擊這個元素，我可以得到目標爲三種元素之一a,i,span

現在頭痛會開始，那麼我需要檢查點擊的是什麼，是不是a或span甚至i

它會帶來不必要的冗餘代碼，如果我可以訪問$（this）。 $（this）的美是它正在返回我正在聽的項目，跨瀏覽器！

在我的情況下$（this）總是引用a而不是其他任何子元素。所以我知道例如，如果我想訪問i我需要搜索子元素。但在Typescript讓我使用的事件中，我需要檢查我在DOM中的位置（目標是span或a或i !!!），然後我決定在樹中爬升或下降，或者進行更改當前元素。

我知道應該有更好的辦法。所以問題是什麼？

來源

2016-07-02 Mo Hrad A

很好的答案躺在實例方法，

從打字稿0.91有正常方法和實例方法及其this之間的不同。這種差異讓我能夠在類實例和jQuery中訪問這兩者。

的樣品類將是這樣的：

class sample{ 

    field1:number; 

    constructor(){ 
     field1=1; 
    } 

    method1(){ 

     let self=this; 
     $("a").click(function(event){  
      var target=$(this); 
      console.log(target); // here i have access to the jquery one 
      console.log(self.field1); // here i have access to the class level 
     }); 
    } 

    method2(){ 

     $("a").click((event)=>{  
      var target=$(this); // this will not work bcs it's an instance method 
           // the this is refering to the class 

      console.log(target); 
     }); 
    } 
}

來源

2016-07-02 12:06:04