我正在尝试使用bootstrap和angular js设计轮播。下面是负责轮播的部分代码。
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner">
<div class="item active">
<img src="../assets/img3.jpg" alt="Monster Book of Monsters" class="image">
</div>
<div class="item">
<img src="../assets/img4.jpg" alt="Awesome Deals" class="image">
</div>
<div class="item">
<img src="../assets/img3.jpg" alt="Monster Book of Monsters" class="image">
</div>
</div>
<!-- Left and right controls -->
<a class="left carousel-control" href="#myCarousel" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#myCarousel" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
<span class="sr-only">Next</span>
</a>
</div>
我的问题是,由于锚标记中包含href,因此每次我尝试通过单击图标来更改图像时,#mycarousel都会附加到我的网址中。我的路线代码如下。
const routes: Routes = [
/* Include the neccessary paths for routing */
{ path: 'login', component: LoginComponent, pathMatch:'full' },
{ path: 'collection', component: CollectionComponent,pathMatch:'full' },
{path:'about',component:AboutComponent,pathMatch:"full"},
{path:'signing',component:SigningComponent,pathMatch:"full"},
{ path: '**', redirectTo: '/about', pathMatch:'full' }];
由于“ path:'**',redirectTo:'/ about',pathMatch:'full'”这条线在我的路径路径定义中,每次#mycarousel附加到我的url时,我都会转移到/ about页面
我也曾尝试删除href锚标签,但轮播无法正常工作。 我该怎么办?