Metody wywoływania TypeScript na klasie wewnątrz zakresu funkcji jquery

Question

Posiadam poniższą klasę TypeScript.

export class BrandViewModel { 

     private _items = ko.observableArray(); 

     public Add(id: number, name: string, active: boolean) : void { 
      this._items.push(new BrandItem(this, id, name, active)); 
     } 

     public Get() : void { 
      $.get("/api/brand", function(items) { 
       $.each(items, function (i, item) { 
         this.Add(item.Id, item.Name, item.Active); 
        }); 
      }, "json"); 
     } 
} 

Powstały JavaScript dla metody Get jest:

BrandViewModel.prototype.Get = function() { 
     $.get("/api/brand", function (items) { 
      $.each(items, function (i, item) { 
       this.Add(item.Id, item.Name, item.Active); 
      }); 
     }, "json"); 
    }; 

Widziałem w dokumentacji TypeScript że mogę to zrobić:

public Get() : void { 
     $.get("/api/brand",() => function(items) { 
      $.each(items, function (i, item) { 
        this.Add(item.Id, item.Name, item.Active); 
       }); 
     }, "json"); 
    } 

co skutkuje poniżej, gdzie _this jest teraz odniesieniem do instancji BrandViewModel, ale this wewnątrz jquery .each funkcja nie jest zmieniany na _this jak mógłbym się spodziewać:

BrandViewModel.prototype.Get = function() { 
     var _this = this; 
     $.get("/api/brand", function() { 
      return function (items) { 
       $.each(items, function (i, item) { 
        this.Add(item.Id, item.Name, item.Active); 
       }); 
      }; 
     }, "json"); 
    }; 

Zamiast zrobiłem poniżej w TypeScript:

public Get(): void { 
     var _this = this; 
     $.get("/api/brand", function(items) { 
      $.each(items, function (i, item) { 
        _this.Add(item.Id, item.Name, item.Active); 
       }); 
     }, "json"); 
    } 

co daje mi wynik chciałem:

BrandViewModel.prototype.Get = function() { 
     var _this = this; 
     $.get("/api/brand", function (items) { 
      $.each(items, function (i, item) { 
       _this.Add(item.Id, item.Name, item.Active); 
      }); 
     }, "json"); 
    }; 

Czy ktoś wie bardziej odpowiedni sposób to zrobić?

Answer 1

Można to zrobić:

public Get() : void { 
     $.get("/api/brand", (items) => { 
      $.each(items, (i, item) => { 
        this.Add(item.Id, item.Name, item.Active); 
       }); 
     }, "json"); 
    } 

który generuje:

BrandViewModel.prototype.Get = function() { 
     var _this = this; 
     $.get("/api/brand", function (items) { 
      $.each(items, function (i, item) { 
       _this.Add(item.Id, item.Name, item.Active); 
      }); 
     }, "json"); 
    }; 

Answer 2

Zgodnie z ECMAScript 6 arrow functions, maszynopis leksykalnie wiąże się to przy użyciu =>.