Angular 2'de bir söz içinde bir sınıf yöntemini nasıl çağırabilirim?

Question

Bir Angular 2 bileşenim varsa ve bir uyumsuzluk sözü veren veya bir gözleme döndüren bir hizmetten veri alıyorum, sonra bu verileri görüntülemek için bileşende bir yöntemi nasıl arayabilirim?

@Component({ 
    moduleId: module.id, 
    selector: 'charts', 
    templateUrl: 'charts.component.html', 
    providers: [DataService] 
}) 
export class ChartsComponent implements OnInit { 

    constructor(private dataService:DataService) 

    ngOnInit() { 
    this.getData(); 
    } 

    getData(){ 
    this.dataService.getData().then(function (data) { 
     this.drawChart(data); 
    }); 
    } 

    drawChart(){ 
    //implement drawing chart 
    } 
} 

sorun bir söz içinde "bu" "this.drawChart()" artık ChartsComponent sınıfına atıfta olmasıdır. Yazma sonrası bir sınıf yöntemini nasıl arayabilirim?

Ayrıca, diğer sınıf özelliklerini kullanması gerektiğinden, ben de drawChart() öğesini sözün içine koyamıyorum. Eğer Arrow functions kullandığınızda

Answer 1

, this tutulur:

getData(){ 
    this.dataService.getData().then((data) => { // <-- changed here 
    this.drawChart(data); 
    }); 
} 

Answer 2

2 çözüm vardır:

 var self = this; 
    ngOnInit() { 
     self.getData(); 
    } 

    getData(){ 
     self.dataService.getData().then(function (data) { 
     self.drawChart(data); 
    }); 

}

2: "kendini" seçeneğini kullanarak

1) "bağlama yöntemi" (veya bunun gibi bir şey) kullanarak:

.then(function (data) { 
     this.drawChart(data); 
    }).bind(this) 

örneğin bu yöntem hakkında çok fazla bilgi bulabilirsiniz: o kod daha şeffaf hale yardımcı olduğu için Use of the JavaScript 'bind' method

ben, ilk çözümü tercih.