Ионная сетка не может отображаться в ionic 3

Я хочу отображать изображения из файла JSON в базе данных firebase, отображается только слайд-шоу, но не изображения продуктов. пожалуйста, помогите мне

<ion-content  class = "dark">
    <ion-slides *ngIf = "promoImagesLoaded" autoplay=6000  slidesPerView=1>
        <ion-slide *ngFor = "let promo of promoSliders">
            <img src = "{{promo.name}}" alt = "">
          </ion-slide>  

    </ion-slides>


     <ion-grid>
      <ion-row *ngFor = "let i of productRows">
        <ion-col *ngFor = "let product of products | slice:(i*2):(i+1)*2" width-50 (click) = "showDetails(product)">
          <ion-card>         
            <img src = "{{product.thumb}}" alt = "">
            <ion-card-content>
                <p>
                    {{product.price | currency:'USD':true:'1.2-2'}}
                </p>
            </ion-card-content>
           </ion-card>
        </ion-col>
      </ion-row>
    </ion-grid>

Есть ошибка в консоли? а что содержит productRows?

Pardeep Jain 11.01.2019 13:37

loadProducts () {this.productService.getProducts (); this.events.subscribe ('productsLoaded', () => {this.products = this.productService.products; this.productRows = Array.from (Array (Math.ceil (this.products.length / 2)). keys ())})}

chris 11.01.2019 16:11

его часть метода loadProducts ()

chris 11.01.2019 16:14

в консоли нет ошибок, ионная сетка должна отображаться под слайдером изображения, <ion-slider> работает идеально, я вижу изображения на консоли

chris 11.01.2019 16:35
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Angular и React для вашего проекта веб-разработки?
Angular и React для вашего проекта веб-разработки?
Когда дело доходит до веб-разработки, выбор правильного front-end фреймворка имеет решающее значение. Angular и React - два самых популярных...
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf
Мы провели Twitter Space, обсудив несколько проблем, связанных с последними дополнениями в Angular. Также прошла Angular Tiny Conf с 25 докладами.
Угловой продивер
Угловой продивер
Оригинал этой статьи на турецком языке. ChatGPT используется только для перевода на английский язык.
Мое недавнее углубление в Angular
Мое недавнее углубление в Angular
Недавно я провел некоторое время, изучая фреймворк Angular, и я хотел поделиться своим опытом со всеми вами. Как человек, который любит глубоко...
Освоение Observables и Subjects в Rxjs:
Освоение Observables и Subjects в Rxjs:
Давайте начнем с основ и постепенно перейдем к более продвинутым концепциям в RxJS в Angular
1
4
35
0

Другие вопросы по теме