在標籤內放置縮略圖

我正在使用angularjs來呈現我的html並使用引導程序3來設置它。這些選項卡正確呈現，但每個選項卡中的圖像不顯示在網格中，而是在一個列中逐個輸出。我究竟做錯了什麼？在標籤內放置縮略圖

<div class="col-sm-12"> 

    <!--Nav Tabs--> 
    <ul class="nav nav-tabs" role="tablist"> 
     <li class="active"><a href="{{'#' + retailProducts[0].Category}}" 
           role="tab" data-toggle="tab"> 
           {{retailProducts[0].Category}} 
          </a></li> 
     <li ng-repeat="pro in retailProductsMinusFirst"> 
      <a href="{{'#' + pro.Category}}" role="tab" data-toggle="tab"> 
       {{pro.Category}} 
      </a> 
     </li> 
    </ul> 

    <!--Tab Panes--> 
    <div class="tab-content"> 
     <div class="tab-pane active" id="{{retailProducts[0].Category}}"> 
      <div class="row"> 
       <div class="col-sm-2"> 
        <a ng-repeat="pro in retailProducts[0].Products" href="#" 
         class="thumbnail"> 
         <img src="{{pro.Product.PrimaryPhotoUrl + '?height=100'}}" 
          alt="Product Photo" /> 
        </a> 
       </div> 
      </div> 

     </div> 
     <div ng-repeat="pro in retailProductsMinusFirst" class="tab-pane" 
      id="{{pro.Category}}"> 
      <div class="row"> 
       <div class="col-sm-2"> 
        <a ng-repeat="img in pro.Products" href="#" class="thumbnail"> 
         <img src="{{img.Product.PrimaryPhotoUrl + '?height=100'}}" 
          alt="Product Photo" /> 
        </a> 
       </div> 
      </div> 

     </div> 
    </div> 

</div>

來源

2014-08-30 user1206480

重複了'COL-SM-2'，而不是它的內容 – charlietfl 2014-08-30 22:01:15

你在重複錨點。您需要重複列div。事情是這樣的：

<div ng-repeat="pro in retailProducts[0].Products" class="col-sm-2"> 
    <a href="#" class="thumbnail"> 
     <img src="{{pro.Product.PrimaryPhotoUrl + '?height=100'}}" 
     alt="Product Photo" /> 
    </a> 
</div>

來源

2014-08-30 22:02:30 isherwood

哇，我累了，哈哈！ – user1206480 2014-08-30 22:28:17

在標籤內放置縮略圖

回答

相關問題