Mat-прогресс-бар. Слушайте, чтобы загрузить прогресс. Angular - PullRequest
2 голосов
/ 24 февраля 2020

Эта функция инициализирует запрос к бэкэнду и работает с результатом:

startUpload(): void {
        this.upload().subscribe(uploadResp => {
                if (uploadResp) {
                    // grab progress value + grab response data (event.body)
                }
        })
}

upload(): Observable<any> {
        return this.apiService.createDataWithProgressTracking(/*path, data*/);
}

Существует запрос на загрузку data в бэкэнд + значение отслеживания хода выполнения:

createDataWithProgressTracking(path: string, data): Observable<any> {
        const req = new HttpRequest('POST', path, data, { reportProgress: true });
        return this.http.request(req).pipe(
            map((event: HttpEvent<any>) => this.getUploadProgress(event)),
            share(),
            last(),
            catchError((error: any) => {
                return this.handleError(error);
            })
        );
}

Вот как я получаю значение прогресса. Но у меня есть сомнения, как правильно вернуть значение прогресса для работы с ним в startUpload()

getUploadProgress(event: HttpEvent<any>): Observable<any> {
        switch(event.type) {
            case HttpEventType.UploadProgress:
                const progress = Math.round(100 * event.loaded / event.total);
                return of(progress);

            case HttpEventType.Response:
                return event.body;
        }
}

ВОПРОС

Как получить значение progress из ответа правильно?

...