http.get не выполняется в Angular 8 - PullRequest
1 голос
/ 10 октября 2019

У меня есть метод, который загружает текст из локального .txt файла в моем ngOnInit():

const headers = new HttpHeaders().set('Content-Type', 'text/plain; charset=utf-8');

// This gets executed
console.log('FIRED');

this.http.get('assets/details.txt', {headers, responseType: 'text'})
    .pipe(
        map(data => {
            // This does not get executed!
            console.log('NOT FIRED');
        }),
        catchError((e: any) => {
            // Also no error Message
            console.log('NOT FIRED AS WELL');
            return throwError(e);
        }),
    );

    // This gets executed as well
    console.log('END');

Где моя ошибка, как бы я отладил это?

Ответы [ 3 ]

3 голосов
/ 10 октября 2019

Наблюдаемое выполняется только при подписке. http.get возвращает наблюдаемое. Измените ваш код, как показано ниже

this.http.get('assets/details.txt', { headers, responseType: 'text' })
  .pipe(
    map(data => {
      // This does not get executed!
      console.log('NOT FIRED');
    }),
    catchError((e: any) => {
      // Also no error Message
      console.log('NOT FIRED AS WELL');
      return throwError(e);
    }),
  ).subscribe((response) => {
    // HTTP call success. Use response here
  }, (error) => {
    // HTTP call failed. Handle error
  });
1 голос
/ 10 октября 2019

Вы уже добавили подписку на свой код?

this.http.get('assets/details.txt', {headers, responseType: 'text'})
    .pipe(
        map(data => {
            // This does not get executed!
            console.log('NOT FIRED');
        }),
        catchError((e: any) => {
            // Also no error Message
            console.log('NOT FIRED AS WELL');
            return throwError(e);
        }),
    ).subscribe(); // here

Что касается документации, уже упоминавшейся

Поскольку метод службы возвращает Observable данных конфигурации, компонент подписывается на возвращаемое значение метода. Обратный вызов подписки копирует поля данных в объект конфигурации компонента, который привязан к данным в шаблоне компонента для отображения.

0 голосов
/ 10 октября 2019

Несмотря на то, что @TonyNgo и @JohnsMathew совершенно правы, отсутствующая подписка - это все, что вам нужно в вашем случае, я надеюсь, что вы не просто воспользуетесь там своим ответом. В большинстве случаев мы пытаемся обойти наблюдаемое вместо его результатов. Это так, чтобы каждый компонент, использующий ваши данные, мог реагировать на изменения через свою собственную логику. Так что в вашем случае вы, скорее всего, захотите написать что-то похожее на:

ApiService.ts:

getDetails(): Observable<any> {
  return this.http.get('assets/details.txt', {headers, responseType: 'text'});
}

SomeComponent.ts

constructor(private apiService ApiService) {}

someFunction() {
  const details$ = this.apiService.getDetails();
  details$.subscribe( detail => { 
    // execute all the things SomeComponent would need
  });
}
...