如何将滑块应用于ngFor循环中的每个图像(角度4)?

时间:2018-07-06 09:26:08

标签: angular

我使用了图像数组。在图像数组中,我们在productDetails.html ngFor循环内使用过。但是,当我们将滑块应用于图像进行循环时,轮播的每个图像都是Seaperate ..我想要一个滑块中的特定产品ID图像,请帮助...组件

    <div class="container-fluid text-center">
  <div class="row content">
    <div id="carouselExampleControls" class="carousel slide" data-ride="carousel">
      <!-- Indicators -->
      <ul class="carousel-indicators">
        <li data-target="#carouselExampleControls" data-slide-to="0" class="active"></li>
        <li data-target="#carouselExampleControls" data-slide-to="1"></li>
        <li data-target="#carouselExampleControls" data-slide-to="2"></li>
      </ul>

      <div class="carousel-inner" *ngFor="let image of images">
        <div class="carousel-item active">
          <div class="container-fluid text-center">
            <div class="row content">
              <div class="col-sm-13">

                <div id="carouselExampleControls" class="carousel slide" data-ride="carousel">
                  <!-- Indicators -->
                  <ul class="carousel-indicators">
                    <li data-target="#carouselExampleControls" data-slide-to="0" class="active"></li>
                    <li data-target="#carouselExampleControls" data-slide-to="1"></li>
                    <li data-target="#carouselExampleControls" data-slide-to="2"></li>
                  </ul>

                  <div class="carousel-inner">
                    <div class="carousel-item active">
                      <img class="d-block w-100" src="http://192.168.0.120:8088/downloadFile/{{image.imageUrl}}" alt="First slide" height="500">

                    </div>
                  </div>


                  <a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
                    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                    <span class="sr-only">Previous</span>
                  </a>
                  <a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
                    <span class="carousel-control-next-icon " aria-hidden="true"></span>
                    <span class="sr-only">Next</span>
                  </a>


                </div>
              </div>

            </div>
          </div>

        </div>
      </div>




    </div>


  </div>
</div>

0 个答案:

没有答案