是否有用于角度6+的转盘,可用于自动播放图像幻灯片以及带有触摸和滑动支持的箭头单击

时间:2019-05-14 05:20:33

标签: angular twitter-bootstrap carousel

我想要一个轮播图像滑块,该滑块可以在角度6 +中进行触摸和滑动支持。我已经完成了代码,但是自动播放功能在代码中也无法正常工作,并且数据绑定到它的速度非常慢,箭头在屏幕上显示得很晚。

   <div id="GalleryHT" class="carousel slide" data-ride="carousel" >

            <!-- Indicators -->
     <ul class="carousel-indicators">
        <li data-target="#GalleryHT"></li>
   </ul>

   <!-- The slideshow -->
  <div class="carousel-inner">

          <div class="carousel-item" *ngFor="let gal of gallery; let isFirst = first" [class.active]="isFirst"  [ngStyle] ="{'background-image':'url('+ gal.image_url +')'}" >

              <div class="caption">
                  {{gal.image_title}}
                </div>
          </div><!-- .carousel-item -->
      </div><!-- .carousel-inner -->



    <!-- Left and right controls -->
      <a class="carousel-control-prev" href="#GalleryHT" data-slide="prev" *ngIf="gallery.length > 1" >
        <img  src="assets/images/icon-left-arrow.png">
      </a>
      <a class="carousel-control-next" href="#GalleryHT" data-slide="next" *ngIf="gallery.length > 1">
        <img  src="assets/images/icon-right-arrow.png">
      </a>
    </div>

  </div>   <!-- .gallery-block -->

1 个答案:

答案 0 :(得分:1)

这些是一些带有示例代码的自动播放轮播的示例。希望对您有帮助。