Разобрать объект JSON в Typescript - PullRequest
Новая
       12

Разобрать объект JSON в Typescript

0 голосов
/ 03 февраля 2019

Я новичок как в Angular, так и в сервисах сборки, использующих пружинную загрузку.Поэтому, пожалуйста, извините, если приведенный ниже вопрос очень простой.

У меня есть следующий ответ JSON от службы весеннего отдыха.Я пытаюсь отобразить этот ответ сервиса на таблицу данных материала Angular.

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

ответ JSON 

{
    "content": [
        {
            "id": "1000",
            "name": "R&D IN",
            "location": "IN",
            "costCenter": "RD-001"
        }
    ],
    "last": false,
    "totalElements": 10,
    "totalPages": 10,
    "size": 1,
    "number": 1,
    "sort": [
        {
            "direction": "ASC",
            "property": "name",
            "ignoreCase": false,
            "nullHandling": "NATIVE",
            "ascending": true,
            "descending": false
        }
    ],
    "first": false,
    "numberOfElements": 1
}

Мне нужно отобразить следующие два атрибута в ответе json выше -> content и totalRecords

У меня есть следующий сервисный код в Angular

Department.service.ts 

getAllDepartments(filter: string, sortOrder: string, pageNumber: number, pageSize: number): Observable<DepartmentList>{

    return this.http.get<DepartmentList>(this.API_URL + '/api/department/', {
      params: new HttpParams()
          .set('filter', filter)
          .set('sort', 'name')
          .set('page', pageNumber.toString())
          .set('size', pageSize.toString())
    });
  }

Department.component.ts

this.deptService.getAllDepartments(filter, sortDirection,pageIndex, pageSize)
      .pipe(
          catchError(() => of([])),
          finalize(() => this.loadingSubject.next(false)))
      .subscribe(
          departments => {
            let obj = JSON.stringify(departments);
            console.log('Department List :: ', departments);
            console.log(obj.content);
            this.departmentSubject.next(departments.content);
            this.departmentRecCount.next(departments.totalElements);
          });

Однако последние две строки показывают ошибку в моем угле.Тем не менее, код работает несмотря на ошибки

Ошибки видны в следующих двух строках - 

this.departmentSubject.next(departments.content);
this.departmentRecCount.next(departments.totalElements);

Сообщение об ошибке - ошибка TS2339: свойство 'content' не имеетсуществуют по типу 'any [] |DepartmentList.Свойство 'content' не существует для типа 'any []'.

Department.model.ts 

export interface DepartmentList {
    content: Department[];
    totalElements: number;
  }

  export interface Department {
    id: string;
    name: string;
    location: string;
    costCenter: string;
  }

Как решить вышеуказанные проблемы.

Пожалуйста, извините, если это уже было объяснено в любой другой теме.

1 Ответ

0 голосов
/ 03 февраля 2019

Попробуйте набрать приведение departments перед его назначением. 

const deptList = departments as DepartmentList;

this.departmentSubject.next(deptList.content);
this.departmentRecCount.next(deptList.totalElements);
...