提前完成编译的Angular应用程序中的计算对象/地图/字典键

Question

我正在开发一个Angular应用，我们希望将路由定义为Enums。然后，为枚举声明它们指向的特定路由。枚举绑定到与CMS系统中的键匹配的字符串值。

例如，我们的第一个简单的实现是：

mainRoutes.ts

export enum RouteKey {
  Dashboard = "dashboard",
  Summary = summary"
}

export routes = {
  [RouteKey.Dashboard]: "dashboard",
  [RouteKey.Summary]: "summary"
}

然后在app.routing.module.ts中，导入和使用这两个变量，如下所示：

...
{
  path: routes[RouteKey.Dashboard],
  component: DashboardComponent,
},
{
  path: routes[RouteKey.Summary],
  component: SummaryComponent,
}

此代码在开发中运行时运行良好，但是如果提前编译，则在编译过程中会失败，并在终端中显示消息expression form not supported，指向使用已计算条目（[RouteKey.Dashboard]: "dashboard"）的第一行。

足够。然后，我们尝试使用Javascript Map对象的另一种方法，如下所示：

...
export const routes = new Map();
routes.set(RouteKey.Dashboard, "dashboard");
routes.set(RouteKey.Summary, "summary");

[app.routing.module.ts中的引用更新为routes.get(***)，而不是routes[***]。

并且在运行开发模式时，代码再次运行良好，这一次代码可以正确构建。

但是，在托管构建并访问站点时，在浏览器中出现以下错误：

Invalid configuration of route '': routes must have either a path or a matcher specified

有人知道我该如何解决这个问题？是否有可能在使用Ahead of Time-compilation的Angular应用程序中有一个用于保存路由的计算字典对象？

Answer 1

您可以尝试使用const ENUM而不是ENUM：

export const enum RouteKey {