콜백 함수 후에 Angular2 뷰가 업데이트되지 않았습니다.

Question

S3 스토리지에 이미지를 업로드 할 때 Meteor-Angular2 및 slingshot 패키지를 사용하고 있습니다. 함수에서 리턴하고 바인드 된 문자열에 지정할 때 갱신되지 않은보기. (setTimout 기능이 작동하고 뷰를 갱신하지만 올린 기능 없음)

export class AdminComponent { 

    public urlVariable: string = "ynet.co.il"; 

    constructor() { 
     this.uploader = new Slingshot.Upload("myFileUploads"); 
     setTimeout(() => { 
      this.urlVariable = "View is updated"; 
     }, 10000); 
    } 

    onFileDrop(file: File): void { 
     console.log('Got file2'); 

     this.uploader.send(file, function (error, downloadUrl) { 
      if (error) { 
       // Log service detailed response 
      } 
      else { 

       this.urlVariable = "View not updated"; 

      } 
     }); 
    } 

} 

Answer 1

사용하여 화살표 함수 (() =>) 대신 function()는 this.

this.uploader.send(file, (error, downloadUrl) => { 
     if (error) { 
      // Log service detailed response 
     } 
     else { 
      // now `this.` points to the current class instance 
      this.urlVariable = "View not updated"; 

     } 
    }); 

https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Functions/Arrow_functions

Answer 2

이 하나의 범위를 유지하도록 나를 위해 일하고 있습니다 : (좁은 기능 + Ngzone)

this.uploader.send(file, (error, downloadUrl) => { 
     if (error) { 
      // Log service detailed response 
     } 
     else { 
      // now `this.` points to the current class instance 
      this._ngZone.run(() => {this.urlVariable = "View not updated"; }); 


     } 
    });