Я пытаюсь связать вложенный наблюдаемый массив с помощью Angular 6 в моем HTML и показать список (image_urls) в моей карусели.Однако я не могу связать вложенный массив.Любая помощь или совет высоко ценится.Заранее спасибо
Это то, что у меня есть:
Components.ts
getAvailableCars()
{
this.cars$ = this.carService.getAvailableCars();
this.cars$.subscribe(car => {
car.forEach(c => {
c.image_urls = new Array<any>();
this.fileUploads = this.uploadFileService.getFiles(c.car_id);
this.fileUploads.subscribe(res => {
c.image_urls = res;
});
});
});
}
HTML
<div class="row" *ngFor="let car of cars$ | async”>
<span>{{car.name}}</span>
<mdb-carousel [isControls]="true" [animation]="'slide'”>
<mdb-slide *ngFor="let file of car.image_urls | async”>
<span>{{file.url}}</span>
</mdb-slide>
</mdb-carousel>
</div>
Консоль
Car(3) [{…}, {…}, {…}]
0:
car_id: 30
exterior_color: 4
fuel_type_name: "Petrol"
image_urls: Array(2)
0: FileUpload {url: "https://s3.amazonaws.com/xx/30/SocialPost_5695408_facebook.png"}
1: FileUpload {url: "https://s3.amazonaws.com/xx/30/logo_size.jpg"}
length: 2
__proto__: Array(0)
Если я использую this.fileUploads прямо в Карусели, это работает, но не тогда, когда я помещаю его в c.image_urls.Поскольку у меня несколько автомобилей, и у каждого из них разные URL-адреса, мне нужно добавить image_urls к объекту машины.
Еще раз спасибо!