Угловое преобразование 6 кодов с бэкэндом

Question

Я пытался преобразовать этот метод в последнюю версию Angular 6 этого кода.Мой бэкэнд отправляет файл JSON в приложение Angular, этот метод берет этот файл JSON и делает его таким, чтобы я мог прочитать его для моего HTML.Но, к сожалению, я не понимаю, как изменить этот код на Angular 6, поскольку вы не можете использовать ни .interval, ни .map.

getHeroes(): Observable<Hero[]> {
      return Observable
      .interval(5000)
      .flatMap(() => this.http.get(this.heroesUrl).map((data) => data.json()));
  }

Answer 1

Я бы сделал что-то вроде этого:

import {Injectable} from '@angular/core';
import {HttpClient} from '@angular/common/http';

import {Observable} from 'rxjs';
import {map} from 'rxjs/operators';

// mockup Hero type
export class Hero {
  constructor(public name: string, public job: string) {}
}

@Injectable()
export class HeroService {
  private heroesUrl = 'REMOTE_SERVER_URL';
  constructor(private http: HttpClient) {}
  getHeroes(): Observable<Hero[]> {
    return this.http.get(this.heroesUrl).pipe(map((data: Hero[]) => {
        console.log(data);

        // Do something here to cast data to Hero[] model if data is not so
        return data;
      }));
  }
}

Answer 2

Ваш код будет выглядеть примерно так:

import {interval, Observable} from 'rxjs';
import {flatMap, map} from 'rxjs/operators';

getHeroes(): Observable<Hero[]> {
  interval(500)
    .pipe(
      flatMap(() => this.http
        .get(this.heroesUrl)
        .pipe(map(data => data.json()))
      })
    );
}

Идея проста;все Observable, Subject, .. и методы, которые создают наблюдаемые, импортируются непосредственно из rxjs.И вы больше не можете просто связывать операторы на наблюдаемом объекте, вам нужно использовать метод pipe и поместить все свои операторы туда.Операторы импортируются из rxjs/operators

Sidenote, поскольку вы делаете data.json() Я предполагаю, что вы все еще используете "старые" методы http, вам следует вместо этого начать использовать httpClient.get (https://angular.io/api/common/http/HttpClient)

Кроме того, при обновлении до Rxjs 6 вы можете установить скрипт миграции, который фактически делает это автоматически для вас