Angular 2 - Bootstrap传送带不能正常工作

我正在尝试建立一个传送带。我尽可能精确地跟踪Bootstrap示例，但我没有获得轮播。图像水平显示，而不是显示在幻灯片中。这段代码有问题吗？Angular 2 - Bootstrap传送带不能正常工作

<div class="container"> 
<div class="row"> 
    <div class="col-md-12"> 
     <div id="product-image" class="carousel slide" data-ride="carousel"> 
      <ol class="carousel-indicators"> 
       <li data-target="#product-image" data-slide-to="0" class="active"></li> 
       <li data-target="#product-image" data-slide-to="1"></li> 
      </ol> 

      <div class="carousel-inner" role="listbox"> 
       <div [ngClass]="{active: first}"> 
        <img src="..\assets\img\{{product.images.productImage[0]}}"> 
        <div class="carousel-caption"> 
         <h2>{{product.make}}</h2> 
        </div> 
       </div> 

       <div [ngClass]="{active: first}"> 
        <img src="..\assets\img\{{product.images.productImage[1]}}"> 
        <div class="carousel-caption"> 
         <h2>{{product.make}}</h2> 
        </div> 
       </div> 
      </div> 
      <a class="left carousel-control" href="#product-image" 
       role="button" data-slide="prev"> 
        <span class="icon-prev" aria-hidden="true"></span> 
        <span class="sr-only">Previous</span> 
      </a> 

      <a class="right carousel-control" href="#product-image" 
       role="button" data-slide="next"> 
        <span class="icon-next" aria-hidden="true"></span> 
        <span class="sr-only">Next</span> 
      </a> 
     </div> 
    </div> 
</div>

来源

2017-06-13 koque

你在应用程序中包含了bootstrap.min.js和jquery吗？ –

你能解决吗？面对同样的问题。 – vish213

u能告诉我，你所得到的console.it错误会给我们的想法怎么回事错

来源

2017-06-13 20:36:11

没有错误。所有的图像都是同时排列在屏幕上，而不是一次出现一个。 – koque

我发现在我的案件的问题。这是引导版本问题。尝试使用不同的版本，其中一个有轮播正确显示。没有提到版本，因为我使用不同的方法构建了轮播，但发布了答案，因为问题相同 - 幻灯片显示为堆栈，在控制台或任何地方都没有错误。

来源

2017-08-13 21:17:52 vish213

Angular 2 - Bootstrap传送带不能正常工作

回答

相关问题