如何在Angular Modal Gallery中获取带有图像的数组

时间:2019-03-01 15:21:38

标签: angular typescript modal-dialog gallery

我正在尝试使用“ angular-modal-gallery”在angular应用中创建图库。问题是我不知道如何将可观察的(带有图像数据)从媒体服务转换为数组。 Angular-modal-gallery文档说我需要使用图像初始化数组。

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']));
   }
 }

2 个答案:

答案 0 :(得分:0)

this.mediaService.getAlbum(this.album_id).pipe(map(res => 
   res['photoset']['photo'])).subscribe(res => {
      imagesArraySubscribed.push(res)});

您应该订阅该服务,然后将可观察到的图像推送到数组中

答案 1 :(得分:0)

您必须订阅getAlbum方法,您将收到数据。

this.album$ = this.mediaService.getAlbum(this.album_id).suscribe( (res:any[]) => {
    this.imagesArraySubscribed = res['photoset']['photo']; 
}