In my Angular application, I am working on creating an image gallery using 'angular-modal-gallery'. The main challenge I am facing is how to convert the observable containing image data from the media service into an array. According to the documentation of angular-modal-gallery, I need to initialize an array with the images.
media.service.ts
export class MediaService {
API_URL = AppConfig.settings.api.url;
constructor(private http: HttpClient) { }
getAlbum = (id: string) => {
return this.http.get(`${this.API_URL}/album?id=${id}`);
};
}
component.html
<modal-gallery [modalImages]="imagesArraySubscribed"></modal-gallery>
component.ts
export class PhotoComponent implements OnInit {
imagesArraySubscribed: Array<Image>;
private subscription: Subscription;
private album_id = '12121564564564';
private album$: Observable<any>;
constructor( private mediaService: MediaService ) { }
ngOnInit() {
this.album$ = this.mediaService.getAlbum(this.album_id).pipe(map(res =>
res['photoset']['photo']));
}
}