index.ts 和 xxx.module.ts 中的导出有什么区别

  • 本文关键字:ts 区别 xxx module index angular
  • 更新时间 :
  • 英文 :


index.tsxxx.module.ts出口有什么区别?
为什么要创建index.ts文件?

索引.ts

export * from './about.component';
export * from './about.routes';

xxx.模块.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AboutComponent } from './about.component';
import { AccordionModule } from 'ng2-bootstrap/components/accordion';
@NgModule({
imports: [CommonModule, AccordionModule],
declarations: [AboutComponent],
exports: [AboutComponent]
})
export class AboutModule { }

Index.ts 导出

当您有index.ts文件时,您可以从中导出内容for easier access and readability。假设您有一个非常深的文件结构:

folder1
|folder2
|-|classToExport
|-|folder3
|---|folder4
|-----|classToExport

您可以使用 index.ts 文件执行的操作是合并要导出到项目中的这些类和接口。

// index.ts
export * from ./folder1/folder2/someClass;
export * from ./folder1/folder2/folder3/folder4/otherClass

现在您已经有了 index.ts 文件,您可以以更简洁的方式将这些类导入到其他位置。

// class in different directory tree in the same project
// SomeClass is from first index.ts import, OtherClass is from the second.
import {SomeClass, OtherClass} from 'app/path/to/index.ts_file';

使用您定义的 index.ts 文件,您现在可以从同一个文件导入这两个类/接口。

模块导出

从模块导出类对于开发供其他人使用的工具和库非常重要。以PrimeNG为例。你想使用他们的一个数据表,所以在你的模块中你做一些类似的事情

// in one of your modules
...
imports: [DataTableModule]

您从他们的库中导入了一个模块,现在您可以使用数据表。但是等等,你从来没有说过import Datatable from 'primeng'。如果您只导入数据表模块,您如何访问数据表?因为他们从他们的模块中导出了类。通过从他们的模块导出类,您现在可以通过导入他们的模块来使用该类。

将所有公共属性导出到文件定义中 在 xxx.module 中,您只导出最后一个类。 请记住,导出签名具有范围可见性。

最新更新