сова-карусель с динамическими предметами

Question

Я пытаюсь сделать сову-карусель. Я добавлю элементы из панели администратора. Он автоматически добавит эти предметы в карусель.

@for (int a = 0; a < Model.Count; a += 1) 
      { 
       <div class="owl-carousel owl-theme"> 
        @if (Model.Count > a) 
        { 
         <div class="item-box item"> 
          @Html.Partial("_ProductBox", Model[a]) 
         </div> 
        } 


       </div> 

       <script> 
       $(document).ready(function() { 
        var owl = $('.owl-carousel'); 
        owl.owlCarousel({ 
         items: 3, 
         loop: true, 
         margin: 10, 
         autoplay: true, 
         autoplayTimeout: 1000, 
         autoplayHoverPause: true 
        }); 

       }) 
       </script> 
      } 
     </div> 

Я думаю, что мне нужно поймать идентификаторы элементов и хранить их в динамическом массиве. Затем карусель будет поворачивать предметы по горизонтали. Но не может реализовать.

Answer 1

Вы пытаетесь создать несколько каруселей? Мне кажется, что, возможно, вы хотите отобразить список предметов и отобразить их как карусель? Поэтому вы хотите получить примерно следующее:

<div class="owl-carousel owl-theme"> 
    @foreach(var m in Model) { 
     <div class="item-box item"> 
      @Html.Partial("_ProductBox", m) 
     </div> 
    } 
</div> 

<script type="text/javascript"> 
    $(document).ready(function() { 
     var owl = $('.owl-carousel'); 
     owl.owlCarousel({ 
      items: 3, 
      loop: true, 
      margin: 10, 
      autoplay: true, 
      autoplayTimeout: 1000, 
      autoplayHoverPause: true 
     }); 
    }) 
</script>