使用来自config的外部URL填充路由

时间:2019-06-05 12:00:49

标签: angular config angular-routing

我的路线定义为:

export const routes: Routes = [
  { path: "", redirectTo: "/datasets", pathMatch: "full" },
  {
  path: "help/youtube",
  canActivate: [RedirectGuard],
  component: RedirectGuard,
  data: {
    externalUrl:  "https://youtube.com"
  }
},
...
    @NgModule({
      imports: [RouterModule.forRoot(routes)],
      exports: [RouterModule]
    })
    export class AppRoutingModule {}

重定向防护是处理外部URL的模块。

除了需要对externalUrl进行硬编码之外,我需要从我的appConfig中获取它,但是如果没有这样的构造函数,我将无法访问appConfig:

constructor(@Inject(APP_CONFIG) private appConfig) {}

as appConfig被设置为带有注入令牌的模块,例如:

export const APP_CONFIG = new InjectionToken<AppConfig>("app.config");

所以我试图将此Inject添加到我的AppRoutingModule中,但没有成功。

如何访问appConfig来填充此外部URL?

1 个答案:

答案 0 :(得分:0)

所以我找到了解决方法。

从我的重定向保护程序(我从here获取)中访问appConfig

@Injectable()
export class RedirectGuard implements CanActivate {

  constructor(private router: Router, @Inject(APP_CONFIG) public appConfig: AppConfig) {}

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


      window.location.href = this.appConfig[route.data["externalUrl"]];
      return true;

  }
}

将配置项名称传递为data["externalUrl"],我将在不久后将其重命名为更合适的名称。这将意味着硬编码的URL将无法工作,但是我可以接受。

app-routing.module中的路由定义如下:

{
    path: "help/ingestManual",
    canActivate: [RedirectGuard],
    component: RedirectGuard,
    data: {
      externalUrl:  "ingestManual"
    }
  }

其中ingestManual是我的配置文件中定义的项目。

这使我能够将应用程序路由重定向到外部URL。