Как лучше всего извлекать определенные поля из больших данных, поступающих от сервиса RESTful в Angular? - PullRequest
Новая
       70

Как лучше всего извлекать определенные поля из больших данных, поступающих от сервиса RESTful в Angular?

1 голос
/ 21 сентября 2019

Я звоню в службу RESTful, в которой возвращаемые данные содержат много полей, но я хочу, чтобы интерфейс типа DTO содержал только те данные, которые мне нужны.Я использовал pipe & map из rxjs, но я не знаю, является ли это лучшей практикой или нет:

Возвращенные данные обычно: 

[
  {
    "id": 1,
    "name": "Leanne Graham",
    "username": "Bret",
    "email": "Sincere@april.biz",
    "address": {
      "street": "Kulas Light",
      "suite": "Apt. 556",
      "city": "Gwenborough",
      "zipcode": "92998-3874",
      "geo": {
        "lat": "-37.3159",
        "lng": "81.1496"
      }
    },
    "phone": "1-770-736-8031 x56442",
    "website": "hildegard.org",
    "company": {
      "name": "Romaguera-Crona",
      "catchPhrase": "Multi-layered client-server neural-net",
      "bs": "harness real-time e-markets"
    }
  },
  {...}
]

Данные мне нужны только: 

[
  {
    "id": 1,
    "name": "Leanne Graham",
    "username": "Bret",
    "email": "Sincere@april.biz"
  },
  {...}
]

Интерфейс пользователя: 

export interface User {
    id?:number,
    name?:string,
    email?:string,
    username?:string
}

Служба пользователя: 

export class UsersService {
  constructor(private http: HttpClient) {}

  getAllUsers(): Observable<User[]> {
    return this.http.get<User[]>("https://jsonplaceholder.typicode.com/users")
      .pipe(
        map((data: User[]) =>
          data.map((item: User) => {
            return {
              id: item.id,
              name: item.name,
              email: item.email,
              username: item.username,
            };
          })
        )
      );
  }
}

1 Ответ

1 голос
/ 21 сентября 2019

Я нашел ответ:

Пользовательские интерфейсы: 

interface User {
  id: number,
  name: string,
  email: string,
  username: string
}

interface UserResponse {
  id: number;
  name: string;
  username: string;
  email: string;
  address: any; // lazily using 'any' here
  phone: string;
  website: string;
  company: any; // lazily using 'any' here
}

Служба пользователя: 

export class MyService {
  constructor(private http: HttpClient) { }

  getData(): Observable<User[]> {
    return this.http.get<UserResponse[]>('https://jsonplaceholder.typicode.com/users')
      .pipe(
        map((data: UserResponse[]) =>
          data.map((item: UserResponse) => {
            return <User>{
              id: item.id,
              name: item.name,
              email: item.email,
              username: item.username,
            };
          })
        )
      );
  }
}

Пример Stackblitz

...