народ, я не понимаю, как обработать объект, на который я подписываюсь. Объект представляет собой следующую структуру:
{ data:{ date: "2018-02-20 13:10:23", text: "Описание", id: 1, items: [ 0: { date: "2018-02-20 13:10:23", text: "Описание", images: [ 0: "image1.jpg", 1: "image2.jpg" ], name: "Изображения", type: "images" }, 1: { date: "2018-02-20 13:10:23", text: "Описание", image: null, type: "video", url: "https://www.youtube.com/embed/v64KOxKVLVg" } ] } }
Обращение делаю через сервис:
import {HttpClient} from '@angular/common/http';
import {Injectable} from '@angular/core';
@Injectable()
export class VideoService {
constructor(private http: HttpClient) {}
getVideoTape() {
return this.http.get(`http://ip_adress/api/v1/mixed_galleries/1`);
}
}
Есть интерфейсная модель:
export class VideoListModel {
constructor(
public created_at: string,
public description: string,
public id: number,
public items: any[],
public name: string
) {}
}
А обработку делаю в компоненте:
import {Component, OnDestroy, OnInit} from '@angular/core';
import {Observable, Subscription} from 'rxjs';
import {filter} from 'rxjs/operators';
import {VideoService} from '../shared/services/video.service';
import {VideoListModel} from '../../shared/models/video-list.model';
@Component({
selector: 'app-video-index',
templateUrl: './video-index.component.html',
styleUrls: ['./video-index.component.scss']
})
export class VideoIndexComponent implements OnInit, OnDestroy {
private videoTape = [];
private _subscription2: Subscription;
constructor( private videoService: VideoService ) { }
ngOnInit() {
this._subscription2 = this.videoService.getVideoTape()
.subscribe((data: VideoListModel[]) => {
this.videoTape = data;
console.log(this.videoTape);
});
}
ngOnDestroy() {
this._subscription2.unsubscribe();
}
}
А задача у меня сделать выборку из объектов по type: "video". Через AJAX+jQuery делал это без проблем, а в Angular я относительно новичок. Перелопатил вчера кучу видео-уроков, но нигде не представлены примеры фильтрации таких сложных объектов.
Конструкция типа:
this._subscription2 = this.videoService.getVideoTape()
.pipe(filter((data: VideoListModel[]) => data.items.type === 'video'))
.subscribe((data: any) => {
this.videoTape = data.data;
console.log(this.videoTape);
});
Результатом дает ошибку, мол "Property 'items' does not exist on type 'VideoListModel[]'". Интуитивно я понимаю, что дело скорее всего в интерфейсе, но не могу понять, как интерфейс доработать, чтобы фильтрация работала корректно. Если кто-нибудь сталкивался с фильтрацией сложносоставных объектов, подскажите пожалуйста, как решить эту задачу.