Блог

Я использую Angular 11, и мне нужно выполнить http-вызов API, который выполнит процесс.

Итак, если я выполню этот вызов:

 processData(data) {
    return this.httpClient.post('https://myurl/api/process', {
      data: data
    }, 
    { 
      headers: this.headers() 
    });
}
 

API запустит процесс на стороне сервера и выполнит его.

Поскольку это займет время, мне нужно, чтобы Angular прослушивал и получал разные ответы, например, я мог бы заставить сервер отправлять процент прогресса.

Тогда Angular будет знать, сколько времени осталось, и сообщит пользователю, и, надеюсь, не просто тайм-аут ожидания результата.

Можно ли это сделать в Angular, если да, то как?

Вам нужно использовать reportProgress: true , чтобы показать некоторый прогресс любого HTTP-запроса. Если вы хотите видеть все события, включая ход передачи, вам также необходимо использовать observe: 'events' option и возвращать наблюдаемый тип HttpEvent . Затем вы можете перехватить все события (DownloadProgress, Response .. etc) в компонентном методе. Более подробную информацию можно найти в https://angular.io/guide/http#listening-to-progress-events

Метод post возвращает наблюдаемое значение, которое может даже запускаться несколько раз. Просто используйте свой метод следующим образом:

 processData(data).subscribe((res) => {
   console.log('The server has responded with :', res);
});

console.log('While I wait for the server to respond, I keep doing more stuff');
doMoreStuff();