Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/angular/30.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Angular 角度2:如何将路由重定向到具有命名出口的子路由_Angular_Angular2 Routing - Fatal编程技术网

Angular 角度2:如何将路由重定向到具有命名出口的子路由

Angular 角度2:如何将路由重定向到具有命名出口的子路由,angular,angular2-routing,Angular,Angular2 Routing,我的Angular 2路由器有问题。我无法让它重定向到具有命名出口的特定子路由。我认为这是URL编码的问题。我希望有人能帮助我。这是我的路线设置: const appRoutes: Routes = [ { path: 'browse', component: BrowseComponent, children: [ { path: 'first', component: Browse

我的Angular 2路由器有问题。我无法让它重定向到具有命名出口的特定子路由。我认为这是URL编码的问题。我希望有人能帮助我。这是我的路线设置:

const appRoutes: Routes = [
  { 
    path: 'browse',                
    component: BrowseComponent, 
    children: [
      { 
        path: 'first', 
        component: BrowseFirstComponent,
        outlet: 'view'
      },
      { 
        path: 'second', 
        component: BrowseSecondComponent,
        outlet: 'view'
      },
      { 
        path: 'third', 
        component: BrowseThirdComponent, 
        outlet: 'view'
      },
    ] 
  },
  { path: 'search', component: SearchComponent },
  { path: '',       redirectTo: '/browse/(view:first)', pathMatch: 'full' },
];
如果我手动导航到(按url中的键入),它可以正常工作。但是,如果我导航到,路由器会尝试将我重定向到“浏览/(查看%3Afirst)”,但这不起作用:

异常:未捕获(承诺中):错误:无法匹配任何路由:“浏览/(查看%3Afirst)”

我使用Angular 2.0.0和router Package 3.0.0


有人能帮我吗?

您需要更新到更新的Angular2和路由器版本

这是一个已知问题,大约2周后已修复


对于任何发现重定向到和命名出口问题并在这个问题上遇到障碍的人。 该票自2017年起开放,地址为儿童路线和指定门店的重定向地址

基本上,如果您想将主组件重定向到其中一个子组件,您有两个选择

1) 需要填写“重定向到”的绝对完整路径:

2) 如果您不能这样做(例如,您的路由嵌套包含通配符,如“:id”),则可以通过保护或在父组件本身中执行重定向。基本上,您捕获ActivatedRouteSnapshot以查看您是否位于父级本身或子级之一(如果嵌套的“children”数组为空,您就知道您位于父级上)+捕获RouterStateSnashot以查看您位于哪个url上),然后对所需子级的url执行“navigateByUrl”

canActivateChild(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot
  ): Observable<boolean>|Promise<boolean>|boolean {
    return this.canActivate(route, state);
}


canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {

  if (route.data.redirectToChild.length) {
    const oldUrl = state.url;

    // don't want to be on a child path already,
    // so check that:
    // - we are not already on a child route
    if (route.children.length < 1) {
      const newUrl = oldUrl + '/' +  '(my-outlet:my-child-path)';
      console.log(oldUrl);
      console.log(newUrl);
      this._router.navigateByUrl(newUrl);
    }
  }
}
canActivateChild(
路由:ActivatedRouteSnapshot,
状态:RouterStateSnapshot
):可观察的|承诺|布尔值{
返回此.canActivate(路由、状态);
}
canActivate(路由:ActivatedRouteSnapshot,状态:RouterStateSnashot):布尔值{
if(route.data.redirectToChild.length){
const oldUrl=state.url;
//不想已经在子路径上了,
//因此,请检查:
//-我们还没有走上儿童路线
if(路线.儿童.长度<1){
const newUrl=oldUrl+'/'+'(我的出口:我的子路径)';
console.log(oldUrl);
console.log(newUrl);
这个._router.navigateByUrl(newUrl);
}
}
}