title: Bootstrap grid carousel slider using angular Js
body: <p>I have approximately 20 results. I want to show 2 rows each with 4 grids in tablet mode and I want to slide the grids from left to right (carousel). How do I do this using AngularJS?</p>
  
  <pre><code>&lt;div class="margin-25"&gt;
      &lt;div ng-repeat="customer in customerData" class="col-sm-3"&gt;
        &lt;div class="well"&gt;
  
            &lt;a href="profile.html"&gt;
                &lt;div class="col-sm-4"&gt;
                  &lt;div class="text-center"&gt;
                      &lt;img src="../app/imgs/photo.jpg" width="50" height="50" class="img-circle m-t-xs img-responsive" alt="image"&gt;
                      &lt;div class="m-t-xs font-bold"&gt;{{customer.customerName}}&lt;/div&gt;
                  &lt;/div&gt;
                &lt;/div&gt;
                &lt;div class="col-sm-8"&gt;              
                    &lt;h4&gt;&lt;strong&gt;{{customer.CustomerNumber}}&lt;/strong&gt;&lt;/h4&gt;
                    &lt;address&gt;                
                        {{customer.branch.address}}&lt;br&gt;
                        {{customer.branch.city}}&lt;br&gt;                
                    &lt;/address&gt;
                &lt;/div&gt;
                &lt;div class="clearfix"&gt;&lt;/div&gt;
              &lt;/a&gt;           
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  </code></pre>
  
  <p>Can anybody suggest the best examples or an any approach to do this?</p>
  
  <p><a href="https://i.stack.imgur.com/ozmrX.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ozmrX.png" alt="enter image description here"></a></p>