Question

当我将elvis操作符（？）添加到Angular2中的循环时..猫头鹰旋转木马滑块不起作用它显示数据但不在滑块中..

      <owl-carousel [options]="{
        items:1,
        dots: false,
        nav: true,
        autoplay: true,
        autoplayTimeout:5000,
        autoplayHoverPause:true,
        navText: ['<i class=fa-angle-left/></i>','<i class=fa-angle-right/</i>']
     }"
         [carouselClasses]="['owl-theme', 'sliding','main-slider']">
         <div class="item ad-slide" *ngFor="let slide of adSlides?.data">
             <a [href]="slide.back_link" target="_blank">
                  <img src="v1/images/{{slide.image}}?size=1140"[alt]="slide.advertiser_name" [title]="slide.advertiser_name"  src-fallback="{{ placeholder }}">
             </a>
         </div>
     </owl-carousel>

Answer 1

根据ngx-owl-carousel自述文件（https://github.com/mujtaba01/ngx-owl-carousel）

如果图像数组正在动态更改，则将此数组传递给[items] input

因此，您需要将[items]="adSlides?.data“添加到<your owl-carousel>

<owl-carousel [options]="{
    items:1,
    dots: false,
    nav: true,
    autoplay: true,
    autoplayTimeout:5000,
    autoplayHoverPause:true,
    navText: ['<i class=fa-angle-left/></i>','<i class=fa-angle-right/</i>']
 }"
    [items]="adSlides?.data" <!-- Add this -->
    [carouselClasses]="['owl-theme', 'sliding','main-slider']">
    <div class="item ad-slide" *ngFor="let slide of adSlides?.data">
        <a [href]="slide.back_link" target="_blank">
            <img src="v1/images/{{slide.image}}?size=1140"[alt]="slide.advertiser_name" [title]="slide.advertiser_name"  src-fallback="{{ placeholder }}">
        </a>
    </div>
</owl-carousel>

Elvis运营商在Angular2

1 个答案: