Передача данных после http.post компоненту - PullRequest
Новая
       70

Передача данных после http.post компоненту

0 голосов
/ 23 апреля 2020

Я работаю над небольшим веб-приложением. Сейчас я пытаюсь реализовать функцию загрузки файлов. Все работает хорошо. Я могу загрузить, сохранить его на сервере, а также получить путь к файлу.

Теперь я борюсь с тем, как передать путь к компоненту.

Я попробовал несколько решений , но я не уверен, что использовать, а также как модифицировать код.

Стоит ли использовать asyn c, await или Eventemitter, Observable, et c ...?

И как правильно их использовать, чтобы я получил путь в компоненте, я знаю, что я действительно жду, пока сервисная функция завершит работу sh.

Функция в сервисе 

  // Images hochladen
  uploadImage(postData: FormData): string{
    this.http.post('https://10.0.0.3:3000/api/upload/image', postData)
    .subscribe((responseData) => {
      this.imgPath = responseData['path'];
      console.log(this.imgPath)
    });
    return this.imgPath;
  };

И в компоненте 

const imgPath = this.projectsService.uploadImage(dataFile);
console.log(imgPath);

Спасибо за любую помощь: -)

С уважением

Marcus

1 Ответ

0 голосов
/ 23 апреля 2020

Две основные альтернативы:

Использование обещаний:

Услуга: 

async uploadImage(postData: FormData): Promise<string> {
    const promise = this.http.post('https://10.0.0.3:3000/api/upload/image', postData).toPromise();
    return (await promise)['path'];
  };

Компонент: 

async something() {
  const imgPath = await this.projectsService.uploadImage(dataFile);
  console.log(imgPath);
}

Использование наблюдаемых:

Сервис: 

uploadImage(postData: FormData): Observable<string> {
    return this.http.post('https://10.0.0.3:3000/api/upload/image', postData)
               .pipe(last(),map(r => r['path']));
  };

Компонент: 

something() {
  this.projectsService.uploadImage(dataFile).subscribe(imgPath => {
     console.log(imgPath);
  }
}
...