合并组件以避免导入多个类

Question

我的标签模块需要两个组件。

<tabs>

和

<tab>

要使用此标签，我必须像这样导入：

import { Tabs, Tab } from '../../components/tabs/tabs.component';

在这种情况下，它们只是两个组成部分。但我正在使用更多＆＃34;子组件＆＃34;来规划组件。有没有办法巩固它们？

Answer 1

Typescript允许您import the entire module into a single variable，并使用它来访问模块导出。

在您的情况下，如果您的'../../components/tabs/tabs.component';文件包含以下行：

export class Tab {
...
export class Tabs {

您可以在另一个文件中通过以下方式将它们导入到单个变量中：

import * as TabsModule from '../../components/tabs/tabs.component';

然后使用TabsModule作为前缀访问它们。换句话说：

• Tab变为TabsModule.Tab;和
• Tabs变为TabsModule.Tabs。

Typescript handbook on Modules很好地解释了这一点。

Ps。：Tab中的文件中包含多个组件（Tabs和tabs.component.ts）被认为是Angular2 Style Guide的不良做法。建议将每个组件声明为自己的文件，并创建一个index文件，立即导出它们 - 请参阅Create Import Barrels。