Question

我目前在我的网站上使用的轮播有问题。我试图找到遇到相同问题但找不到的人。

我有一些方法可以将用户重定向到一些不同的页面，并且在主页上，我有一个轮播。

问题是当我单击轮播的左箭头或右箭头时，它会将我重定向到我用appRoutes定义的404notFound。我认为这是由于该模块尝试检查appRoutes中是否存在该路线（此处是轮播的锚点），并且由于不存在，因此将我重定向到错误页面。

这是我的路线：

const appRoutes: Routes = [
  {path: 'home', component: HomeComponent},
  {path: 'customers', component: CustomersComponent},
  {path: 'pricing', component: PricingComponent},
  {path: 'teaminapp', component: TeaminappComponent},
  {path: 'eventapp', component: EventappComponent},
  {path: 'species', component: SpeciesComponent},
  {path: 'contact', component: ContactComponent},
  {path: 'notFound', component: FourohfourComponent},
  {path: '**', redirectTo: '/notFound'}
];

我从W3Schools带走的旋转木马：

<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/test.jpg" alt="Los Angeles" style="width:100%;">
      <div class="carousel-caption">
        <h2>Team In'App</h2>
        <hr>
        <p>Offrez un espace privilégié et interactif à vos équipes, vos membres avec une application personnalisée, flexible et évolutive.</p>
      </div>
    </div>

    <div class="item">
      <img src="../../../assets/test2.jpg" alt="Chicago" style="width:100%;">
      <div class="carousel-caption">
        <h2>Event'App</h2>
        <hr>
        <p>Dopez vos événements avec une application personnalisée, flexible et évolutive.</p>
      </div>
    </div>

    <div class="item">
      <img src="../../../assets/test3.jpg" alt="New york" style="width:100%;">
      <div class="carousel-caption">
        <h2>Solutions sur mesure</h2>
        <hr>
        <p>Lorem Ipsum dolor sit amet, consectetur adipisicing elit. Adipisci, autem.</p>
      </div>
    </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>

如果您需要，我准备为您提供更多代码。

希望您能帮助我。

谢谢！

轮播重定向到404notFound路线

0 个答案: