如何在打字稿中导出数组

Question

在Angular4应用程序中，我使用服务来导出一些在整个应用程序中使用的常量，枚举和接口。我想导出一个字符串数组，其键是anum中的键。这就是我现在所拥有的：

export enum ContextMenus {
  ... (more options)
  OBJECT_COLOR_RED = 120,
  OBJECT_COLOR_GREEN = 121,
  OBJECT_COLOR_BLUE = 122
}

我想基于上面的枚举值导出一个字符串数组，如下所示：

let ObjectStyles : string[];
ObjectStyles[ContextMenus.OBJECT_COLOR_RED] = '#f00';
ObjectStyles[ContextMenus.OBJECT_COLOR_GREEN] = '#0f0'
ObjectStyles[ContextMenus.OBJECT_COLOR_BLUE] = '#00f';

export ObjectStyles; // THIS IS WHAT I DON'T KNOW HOW TO WRITE

我曾尝试export default RulesStyles按照论坛中的建议使用，但是当我尝试从这样的组件中导入它时：

import { ContextMenus, ObjectStyles } from '../app-options.service';

编译器抱怨模块'app-options.service没有导出的成员ObjectStyles'。

另一个建议的解决方案是像这样导出ObjectStyles：

export { ObjectStyles };

在这种情况下，编译器不会抱怨，但是应用程序在运行时崩溃，并显示以下错误：

TypeError: ObjectStyles is undefined

我该怎么办？谢谢！

Answer 1

我刚刚想起几周前读到的关于计算属性作为数组键的内容。您必须将它们放在括号之间才能使其正常工作。所以，我可以使用这段代码做我想做的事情：

export var ObjectStyles = {
  [ContextMenus.OBJECT_COLOR_RED] : '#f00',
  [ContextMenus.OBJECT_COLOR_GREEN] : '#0f0',
  [ContextMenus.OBJECT_COLOR_BLUE] : '#00f'
};

这样做可以让我从应用程序中的每个组件导入和使用 ObjectStyles。

Answer 2

您已经找到了解决问题的方法（万岁！），但是我想提供一些有关为什么原始代码无法正常工作的信息。让我们看看尝试编译它时收到的错误消息：

需要声明或声明。

之所以出现这种情况，是因为您试图导出文字表达式 ObjectStyles（计算结果取决于对象）。除非您使用default导出，否则您将无法执行此操作，因为否则将没有名称附加。

取而代之的是，您必须导出一个声明，该声明将名称引入程序并可以选择分配给它。这就是您在答案中所做的工作-您在声明命名变量ObjectStyles，导出该变量，然后为其分配值。

您也可以像这样固定原始示例：

// Personally I'd replace the 'let' with a 'const' here
// Also, it's worth noting that ObjectStyles is an object, not an array!
export let ObjectStyles = {};
ObjectStyles[ContextMenus.OBJECT_COLOR_RED] = '#f00';
ObjectStyles[ContextMenus.OBJECT_COLOR_GREEN] = '#0f0'
ObjectStyles[ContextMenus.OBJECT_COLOR_BLUE] = '#00f';

也就是说，您的版本更好-只是表明它们在功能上是等效的:)

Answer 3

在打字稿中，你可以这样做，创建一个文件，将其命名为你想要的任何名称，然后导出 const 或 var

export const someArray:string[] = [
"Initiated",
"Done"

]`

然后在你需要的文件中你可以导入它

import { fontTypes } from "../somwhere";