Bootstrap Carousel - 按类别查看幻灯片

Question

使用Bootstraps Carousel，我有一个项目列表。每个项目都有一个“类别”分配给我选择的。我试图使用的逻辑是：

1. 加载轮播
2. 点击下一个箭头
3. 在列表中找到具有category = landscape
的“下一个项目”
4. 设为“有效”并跳转/跳至该幻灯片
5. 重复步骤2到4

以下是我正在使用但目前无法使用的代码..

<div id="myCarousel" class="carousel slide" data-interval="false">
 <div class="carousel-inner" role="listbox">
   <div class="item landscape active">...image</div>
   <div class="item">...image</div>
   <div class="item">...image</div>
   <div class="item">...image</div>
   <div class="item landscape">...image</div>
   <div class="item">...image</div>
   <div class="item landscape">...image</div>

$('#myCarousel').on('slide.bs.carousel', function (e) {
 var active = $(e.target).find('.carousel-inner > .item.active');
 var from = active.index();
 var next = $(e.target).find('.carousel-inner > .item.landscape');
 var to = next.index();
});