角种子应用程序中的Bootstrap Carousel Prev / Next发生故障

Question

我在Angular-Seed项目中添加了Bootstrap。轮播指示器工作正常，但是上一个/下一个按钮存在问题。

单击“上一个”按钮时，即使您再次单击“上一个”，它也会切换到“上一张图像”并停留在其上。单击“下一步”按钮时，它将切换到第二张图像并停留在第二张图像上。

试图用CDN链接替换JQuery / Bootstrap，但是它们的版本不是问题。

这是我正在使用的轮播：-

    <div class="container">
      <div id="carouselControls" class="carousel slide" data-ride="carousel">
        <ol class="carousel-indicators">
        <li data-target="#carouselControls" data-slide-to="0" class="active"</li>
        <li data-target="#carouselControls" data-slide-to="1"></li>
        <li data-target="#carouselControls" data-slide-to="2"></li>
        <li data-target="#carouselControls" data-slide-to="3"></li>
        <li data-target="#carouselControls" data-slide-to="4"></li>
        </ol>

        <div class="carousel-inner" role="listbox">
            <div class="item active">
                <img class="d-block w-100" src="Main.jpg" alt="">
            </div>
            <div class="item">
                <img class="d-block w-100" src="mainOne.jpg" alt="">
            </div>
            <div class="item">
                <img class="d-block w-100" src="numberFive.jpg" alt="">
            </div>
            <div class="item">
                <img class="d-block w-100" src="numberFour.jpg" alt="">
            </div>
            <div class="item">
                <img class="d-block w-100" src="numberThree.jpg" alt="">
            </div>
        </div>

    <a class="left carousel-control" href="#carouselControls" role="button" data- 
   slide="prev">
            <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"> 
    </span>
            <span class="sr-only">Previous</span>
        </a>

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