Угловое 6 обратное отображение отсутствует

Question

Обновление проекта с Angular 4 до 6 и некоторые проблемы с возвращением к работе. Мой JSON приходит как

{
    "incomingViolationList":[{"productName": "Mirror",…],
    "incomingViolationListCount": 67
}

Мой сервисный вызов используется, чтобы выглядеть так, но в A6 .map больше не работает.

return this.http.get('MappViolations/MappViolations?', options)
      .map(response => <GridDataResult>{
        data: response.json().incomingViolationList,
        total: response.json().incomingViolationListCount
      });

Я начал свой новый сервисный вызов, но затрудняюсь разделить на «данные» и «итого» * ​​1007 *

return this.http.get<IncommingViolations[]>
      (AppSettings.API_ENDPOINT + 'MappViolations/MappViolations?', { params });

Answer 1

В Angular 6 вы будете использовать HttpClient, который возвращает ответ json по умолчанию. Таким образом, вы можете удалить JSON из ответа.

return this.http.get('MappViolations/MappViolations?', options)
     .pipe( 
 map(response => ({
  data: response.incomingViolationList, //<-- remove json
  total: response..incomingViolationListCount //<-- remove json
 })

);

Answer 2

Таким образом, вы заявили в комментарии, что ваш случай таков, что карта не вариант . Ну, на самом деле это все еще есть, но используется немного по-другому

return this.http.get('MappViolations/MappViolations?', options)
      .pipe(
        map(response => <GridDataResult>{
          data: response.json().incomingViolationList,
          total: response.json().incomingViolationListCount
      }));

Обратите внимание на использование pipe непосредственно на наблюдаемую сумму map.

Answer 3

В Angular 6 вместо службы Http используется HttpClient

При использовании HttpClient объектом ответа по умолчанию является JSON, поэтому больше нет необходимости его анализировать (response.json() не требуется)

Также, если вы обновите RxJS 6 обновлением Angular 6, оно будет выглядеть примерно так: pipe способные операторы.

return this.http.get('MappViolations/MappViolations?', options)
  .pipe( 
     map((response: any) => ({
      data: response.incomingViolationList,
      total: response..incomingViolationListCount
     })
  );