Question

我刚刚将Angular2升级到最终版本，我正在寻找好的做法。

我有一个开始页面，在开始时显示一组用户，通过访问REST服务可以知道该组。

我去www.app.com - 角度应用程序启动，它检索它应显示的组。此时我希望应用程序转到www.app.com/group/group1 - 但在检索组名之前，angular已经尝试导航并抛出异常，因为它没有找到路径。

我想出了2个黑客：

制作＆＃39;＆＃39; route转到GroupSelector组件，从那里导航组名称解析后，它很糟糕，因为我真的想在另一个组件上启动我的应用程序
等待组名，然后使用Router.navigate导航，这会引发异常，因为找不到路由，即使应用程序有效

使用以前版本的Angular2 Router（beta 1），我启动了像www.app.com这样的应用程序 - 应用程序已加载，它检索了一个组的名称，然后使用Router.navigate应用程序将加载Groups组件并提供正确的这个组件的组名参数，一切正常

有没有办法如何延迟路由器，只有在从REST服务中检索到必要的数据后才能重定向到正确的路由？

Answer 1

在路由器配置文件中使用resolve属性

// team.resolve.ts
@Injectable()
class TeamResolver implements Resolve<{}> {
  constructor(private http: Http) {}
  resolve(
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot
  ): Observable<any>|Promise<any>|any {
    return this.http.get("/api/team/" + route.params.id);
  }
}

// app.module.ts
@NgModule({
  imports: [
    RouterModule.forRoot([
      {
        path: 'team/:id',
        component: TeamCmp,
        resolve: {
          team: TeamResolver
        }
      }
    ])
  ],
  providers: [TeamResolver]
})
class AppModule {}

https://angular.io/docs/ts/latest/api/router/index/Resolve-interface.html

Angular 2路由器 - 应用程序起始页面的路由

1 个答案: