Firebase Storage UploadTask에서 ProgressBar를 업데이트 할 수 없습니다.

Question

저는 Angular2와 Firbase Storage를 사용하고 있습니다. 'uploadProcess'값을 (HTML 파일에 지정된) 업데이트하려면 얻으려고하지만 어떻게 든 uploadTask.on 함수의 'uploadProgress'변수를 업데이트 할 수 있습니다. 그것은 다른 스레드에서 실행되고 있기 때문입니까? 이 문제의 해결 방법은 무엇입니까? 호프 누군가가 나를 도울 수 있습니다. 또 다른 스레드에서 실행되고 있기 때문에 감사

======================================================================= 
import { Component } from '@angular/core'; 
import { AngularFire, FirebaseListObservable } from 'angularfire2'; 
import * as firebase from 'firebase'; 

@Component({ 
    selector: 'app-create-folder', 
    templateUrl: './create-folder.component.html' 
}) 

export class CreateFolderComponent { 

public fItem: FolderItem; 
public f: File; 
public storageRef: Storage; 
public uploadProgress = 0; 


constructor(public af: AngularFire) {} 

onSubmit() {

const storageRef = firebase.storage().ref().child('myclient/' +  
this.fItem.file_name); 
var uploadTask = storageRef.put(this.f); 


    uploadTask.on('state_changed', function(snapshot){ 
    this.uploadProgress = (snapshot.bytesTransferred/snapshot.totalBytes) * 
    100; 


    }); 

} 


} 

Answer 1

가 있습니까?

다른 컨텍스트에서 실행되기 때문에.

을 'state_changed'콜백 기능 밖의 변수에 할당하면 문제를 해결할 수 있습니다. 그런 다음이 변수를 초기 인스턴스에 대한 참조로 사용할 수 있습니다.

public uploadFile() { 
     let self = this; 
     ... 
     firebaseUploadTask.on('state_changed', 
      function progress(snapshot) { 
       self.percentage = (snapshot.bytesTransferred/snapshot.totalBytes) * 100; 
      }, 
      function error(error) {}, 
      function complete() {} 
     ); 
    }