PHP & Carousel - 在轮播中循环图像，图像在我的数据库中获取

Question

您好，到目前为止我可以获取图像，但它不能作为轮播，它只是直线列出。这是问题所在，请查看此图片

这是我的数据库

这是我的 php 代码，其中添加了轮播，请查看，谢谢。

    <?php
  $data = mysqli_query($con,"SELECT * FROM pax_safeties");
    $count = mysqli_num_rows($data);
    if ($count != 0) {
      while($row = mysqli_fetch_array($data)) {
         echo '<div class="tab-pane" id="tabs-5" role="tabpanel"><br>
<div class="container-fluid">
<div class="row">
<div class="col-6 col-md-6">
<a data-toggle="modal" data-target="#basicExample" target="_blank">

<img src="images/pal/'.$row['paxsafety_image'].'" width="100%">

<div class="modal fade" id="basicExample" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
 <div class="modal-dialog" role="document">
  <div class="modal-content">

<!--------------------CAROUSEL INSERT IMAGES WITH NULL VALUES  ---------------------------------------------------------------------------->

   <div id="carousel-example-11z" class="carousel slide carousel-fade" data-ride="carousel">
    <ol class="carousel-indicators">
     <li data-target="#carousel-example-11z" data-slide-to="0" class="active"></li>
     <li data-target="#carousel-example-11z" data-slide-to="1"></li>
     </ol>
        <div class="carousel-inner" role="listbox">
         <div class="carousel-item active">';

//MY FOREACH TO LOOP THE IMAGE 

         foreach ($data as $key) {
        echo '<img class="d-block w-100" src="images/pal/'.$key['paxsafety_image'].'" alt="First slide">';
     }


     echo '</div>
    </div>
    <a class="carousel-control-prev" href="#carousel-example-11z" 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="#carousel-example-11z" role="button" data-slide="next">
     <span class="carousel-control-next-icon" aria-hidden="true"></span>
     <span class="sr-only">Next</span>
    </a>
   </div>
<!--------------------END OF CAROUSEL INSERT IMAGES WITH NULL VALUES  ---------------------------------------------------------------------------->
  </div>
 </div>
</div>
</a>
</div>
}
}
?>

Answer 1

 <?php
  $data = mysqli_query($con,"SELECT * FROM pax_safeties");
    $count = mysqli_num_rows($data);
    if ($count != 0) {
      while($row = mysqli_fetch_array($data)) {
         echo '<div class="tab-pane" id="tabs-5" role="tabpanel"><br>
<div class="container-fluid">
<div class="row">
<div class="col-6 col-md-6">
<a data-toggle="modal" data-target="#basicExample" target="_blank">

<img src="images/pal/'.$row['paxsafety_image'].'" width="100%">

<div class="modal fade" id="basicExample" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
 <div class="modal-dialog" role="document">
  <div class="modal-content">

<!--------------------CAROUSEL INSERT IMAGES WITH NULL VALUES  ---------------------------------------------------------------------------->

   <div id="carousel-example-11z" class="carousel slide carousel-fade" data-ride="carousel">
    <ol class="carousel-indicators">';
    $j=0;
     foreach ($data as $key) {
     echo '<li data-target="#carousel-example-11z" data-slide-to="'.$i.'" class="'.$j==0?'active':''.'"></li>';
     $j++;}    
     echo '</ol>
        <div class="carousel-inner" role="listbox">';
        $i=1;
         foreach ($data as $key) {
        echo '<div class="carousel-item '.$i==1?'active':''.'">';
        echo '<img class="d-block w-100" src="images/pal/'.$key['paxsafety_image'].'" alt="First slide"></div>';
     $i++;}


     echo '</div>
    <a class="carousel-control-prev" href="#carousel-example-11z" 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="#carousel-example-11z" role="button" data-slide="next">
     <span class="carousel-control-next-icon" aria-hidden="true"></span>
     <span class="sr-only">Next</span>
    </a>
   </div>
<!--------------------END OF CAROUSEL INSERT IMAGES WITH NULL VALUES  ---------------------------------------------------------------------------->
  </div>
 </div>
</div>
</a>
</div>';
}
}
?>