'This' in Komponente von Typescript vs ES5 in Angular2

Question

Also habe ich versucht, meine Angular2 App von Typescript nach ES5 zu konvertieren und habe versucht, beide ähnlich laufen zu lassen. Das Problem, das ich habe, ist die this.people in der ES5-Version zu aktualisieren.

Als ich console.log this im Konstruktor gegenüber in meiner searchFor Methode, erhalte ich das Scoping der Klasse gegenüber dem Umfang des Fensters. Wenn ich console.log this in meiner Typescript-Version, bleibt es innerhalb der SearchComponent und ist in beiden identisch.

Typoskript Version:

import {Component} from 'angular2/core'; 
import {PersonService} from './person-service'; 

@Component({ 
    selector: 'search', 
    properties: ['searchTerm'], 
    templateUrl: `search.html`, 
}) 

export class SearchComponent { 
    searchTerm:string; 
    searchPrefix:string; 
    people:Person[]; 

    constructor(private _personService:PersonService) { 
    this.searchTerm = ''; 
    this.searchPrefix = ""; 
    this.people  = []; 
    this.predicate = 'last'; 
    } 

    searchFor(term) { 
    if (term.length < 2) 
     this.people = []; 
    else { 
     this._personService.getUsers(term) 
     .then((people)=> { 
      this.people = people; 
     }); 
    } 
    } 
} 

ES5 Version

(function(app) { 
    app.SearchComponent = ng.core 
    .Component({ 
     selector: 'search', 
     properties: ['searchTerm'], 
     templateUrl: 'search.html', 
     providers: [app.PersonService] 
    }) 
    .Class({ 
     constructor: [app.PersonService, ng.router.Router, 
     function(_personService, _router) { 
      this.searchTerm = ''; 
      this.searchPrefix = ""; 
      this.people = []; 
      this._personService = _personService; 
      this._router = _router; 
     } 
     ], 
     searchFor(term){ 
     if (term.length < 2) 
      this.people = []; 
     else { 
      this._personService.getUsers(term) 
      .then(function(people) { 
       //Problem is with the 'this' below: 
       this.people = people; 
      }); 
     } 
     } 
    }); 
})(window.app || (window.app = {})); 

Ich habe Arbeit bei der Herstellung der Komponenten und Dienstleistungen einen gewissen Erfolg hatten, aber ich bin ein bisschen auf this stapfte, ha. Jede Hilfe oder Korrekturen mit dem Problem würde wirklich geschätzt werden!

Answer 1

Ändern Sie den Code sein:

this._personService.getUsers(term) 
     .then(function(people) { 
      //Problem is with the 'this' below: 
      this.people = people; 
     }.bind(this)); 

(Der Kontext, das ist falsch In ES6 Sie Pfeil Funktion haben, die dieses Problem lösen.)