Question

我有一个非常简单的Angular路由模块，用于从一个路由重定向到另一个路由：

现在，我想更改重定向，以便它依赖于一个路由参数（可能有比此更多的参数）。因此，.card { text-align: center; background-color: green; border-style: unset; position: relative; padding-bottom: 40px; } .card-links { position: absolute; left: 50%; top: 250px; margin-top: 25%; -webkit-transform: translateX(-50%); transform: translateX(-50%); }应重定向到<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script> <div class="section2"> <div class="container"> <div class="maintext"> <h1>Our Vision</h1> </div> <div class="subtext"> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p> </div> <div class="row"> <div class="col-md-4"> <div class="card"> <div class="images"> <img src="" alt="" width="80" height="80"> </div> <h2>Some Text Over Here <BR> </h2> <div class="card-links" class="card1"><a href="#">Watch Video</a></div> </div> </div> <div class="col-md-4"> <div class="card"> <div class="images"> <img src=""> </div> <h2>Even More Text. <BR>Over Here Blah BLah</h2> <div class="card-links" id="card2"><a href="#">Read More</a></div> </div> </div> <div class="col-md-4"> <div class="card"> <div class="images"> <img src=""> </div> <h2>Some & Text <BR> </h2> <div class="card-links" id="card3"><a href="#">Watch Now</a></div>，$array = array('Leanna', 'nicole', 'Lisa', 'Sarah', 'Leopard', 'Michael', 'jack', 'logan'); array_map("getEntries", $array); function getEntries($e) { if($e[0] == "L" || $e[0] == "l") { echo $e; } }应重定向到import { NgModule } from '@angular/core'; import { Routes, RouterModule } from '@angular/router'; const routes: Routes = [ { path: 'foo', redirectTo: 'bar', pathMatch: 'full' } ]; @NgModule({ imports: [RouterModule.forChild(routes)], exports: [RouterModule], providers: [] }) export class FooRoutingModule { }。实现这一目标的最简单方法是什么？

Answer 1

您可以使用Guards来操纵路由。

在你的情况下，CanActivate后卫应该做好这项工作。在这里阅读更多相关信息：https://angular.io/guide/router#canactivate-requiring-authentication

@Injectable()
export class MyGuard implements CanActivate {

  constructor(public router: Router) {}

  canActivate(route: ActivatedRouteSnapshot) {
   switch(route.queryParams['para']) {
     case '0' :
        this.router.navigate(['my/url]);
        break;
     case '1':
          ....
    }
    return false;
  }
}

＆＃34;返回false;＆＃34;在您的路由中非常重要，因此当前导航（在您的情况下为＆＃39; foo＆＃39;）将被取消。

在您的路由

中

const routes: Routes = [
  {
    path: 'foo', canActivate:[ MyGuard ]
  }
];

根据路径参数定义要重定向的角度路由

1 个答案: