title: bootsrap carousel is not working with angular 7
body: <p>I am using bootstrap multi carousel, It is working fine when I am not using loop. But I am trying to make it dynamic using ngFor loop It's not working properly. It sliding with single Images <a href="https://i.stack.imgur.com/cdqEr.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/cdqEr.png" alt="enter image description here"></a> ....................................................................................................................</p>
  
  <pre><code>&lt;div class="row"&gt;
                      &lt;div class="col-xs-12 col-md-12 col-centered"&gt;
                          &lt;div id="carousel" class="carousel slide" data-ride="carousel" data-type="multi"
                              data-interval="2500"&gt;
                              &lt;div class="carousel-inner"&gt;
                                  &lt;div class="item" [class.active]="_index == '0'" *ngFor="let item of homedata.data.home_page_1.product_section.data;let _index = index"&gt;
                                      &lt;div class="carousel-col"&gt;
                                          &lt;div class="single-elomous-product "&gt;
                                              &lt;!-- Product Image Start --&gt;
                                              &lt;div class="pro-img"&gt;
                                                  &lt;a href="#"&gt;
                                                      &lt;img class="primary-img" src="assets/img/products/p1.jpg"
                                                          alt="single-product"&gt;
                                                      &lt;img class="secondary-img" src="assets/img/products/p2.jpg"
                                                          alt="single-product"&gt;
                                                  &lt;/a&gt;
                                                  &lt;!-- &lt;div class="pro-actions-link"&gt;
                                                  &lt;a href="#" title="Compare"&gt;&lt;span class="icon icon-MusicMixer"&gt;&lt;/span&gt;&lt;/a&gt;
                                                  &lt;a href="#" title="Wishlist"&gt;&lt;span class="icon icon-Heart"&gt;&lt;/span&gt;&lt;/a&gt;
                                                  &lt;a href="#" data-toggle="modal" data-target="#myModal" title="Quick View"&gt;&lt;span class="icon icon-Eye"&gt;&lt;/span&gt;&lt;/a&gt;
                                                  &lt;/div&gt; --&gt;
                                              &lt;/div&gt;
                                              &lt;!-- Product Image End --&gt;
                                              &lt;!-- Product Content Start --&gt;
                                              &lt;div class="pro-content"&gt;
                                                  &lt;div class="pro-info"&gt;
                                                      &lt;!-- &lt;div class="product-rating"&gt;
                                                      &lt;i class="fa fa-star"&gt;&lt;/i&gt;
                                                      &lt;i class="fa fa-star"&gt;&lt;/i&gt;
                                                      &lt;i class="fa fa-star"&gt;&lt;/i&gt;
                                                      &lt;i class="fa fa-star"&gt;&lt;/i&gt;
                                                      &lt;i class="fa fa-star-o"&gt;&lt;/i&gt;
                                                      &lt;/div&gt; --&gt;
                                                      &lt;h4&gt;TATA BUZZ&lt;/h4&gt;
                                                      &lt;p class="ptest"&gt;All Perfect !! I have three sites with magento ,
                                                          this theme is the best !! Excellent support , advice theme
                                                          installation package , sorry for English, are Italian but I had
                                                          no problem !! Thank you !..&lt;/p&gt;
                                                  &lt;/div&gt;
                                                  &lt;!-- &lt;div class="pro-add-cart"&gt;
                                                      &lt;a href="cart.html" title="Add to Cart"&gt;Add To Cart&lt;/a&gt;
                                                  &lt;/div&gt; --&gt;
                                              &lt;/div&gt;
                                              &lt;!-- Product Content End --&gt;
                                              &lt;!-- &lt;span class="sticker-sale"&gt;-5%&lt;/span&gt; --&gt;
                                          &lt;/div&gt;
                                      &lt;/div&gt;
                                  &lt;/div&gt;                                
                              &lt;/div&gt;
  
                              &lt;!-- Controls --&gt;
                              &lt;div class="left carousel-control"&gt;
                                  &lt;a href="#carousel" role="button" data-slide="prev"&gt;
                                      &lt;span class="glyphicon glyphicon-chevron-left text-primary"
                                          aria-hidden="true"&gt;&lt;/span&gt;
                                      &lt;span class="sr-only" aria-hidden="true"&gt;Previous&lt;/span&gt;
                                  &lt;/a&gt;
                              &lt;/div&gt;
                              &lt;div class="right carousel-control"&gt;
                                  &lt;a href="#carousel" role="button" data-slide="next"&gt;
                                      &lt;span class="glyphicon glyphicon-chevron-right text-primary"
                                          aria-hidden="true"&gt;&lt;/span&gt;
                                      &lt;span class="sr-only"&gt;Next&lt;/span&gt;
                                  &lt;/a&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
  
                      &lt;/div&gt;
                  &lt;/div&gt;
  </code></pre>