打字稿:如何导出变量

时间:2017-03-01 19:51:09

标签: typescript import module export

我想打开' file1.ts'并写:

export var arr = [1,2,3];

并打开另一个文件,让我们说'file2.ts'并直接访问' arr'在file1.ts中:

我是这样做的:

import {arr} from './file1';

但是,当我想访问“arr”时,我不能写“#r”,但我必须写“#arr.arr'” ;。第一个是模块名称。如何直接访问导出的变量名称?

3 个答案:

答案 0 :(得分:43)

如果你这样做:

var arr = [1,2,3];
export default arr;

...

import arr from './file1';

然后它应该工作

答案 1 :(得分:37)

有两种不同类型的导出,命名为默认

每个模块可以有多个命名导出但只有一个默认导出。

对于命名导出,您可以尝试类似:

// ./file1.ts
const arr = [1,2,3];
export { arr };

然后要导入,您可以使用以下语句:

// ./file2
import { arr } from "./file1";
console.log(arr.length);

这将满足您提到的arr.arr的需求。

答案 2 :(得分:-1)

我在一个共享的导入/导出示例文件中制作了全部文件。 它是本身的进出口和再进口/再出口。 使用以下命令创建index.ts文件:

// ##Export file:
export { NgModule } from '@angular/core'; //1
export * as AngularCore from '@angular/core'; //2
export * from '@angular/forms'; //3
import * as AngularForms from '@angular/forms'; //4.1
export { AngularForms }; //4.2

export const someVar = 10; //5
export { someVar as someVar2 }; //6
//export default someVar3; - export some variable (only one `default` export from file)

export class Class0 {} //7
export { Class0 as Class1 }; //8
class Class2 {} //9.1
export { Class2 }; //9.2

export default class ClassDef {} //10
export { default as ClassDef2 } from '.'; //11 (imports from itself and exports)


// ##Import file.
import { AngularCore, AngularCore as AngCore } from '.';
const injectable = AngularCore.Injectable; //-2
const Injector = AngCore.Injector; //-2

import * as Modules from '.';
const ngModule = Modules.NgModule; //-1
const component = Modules.AngularCore.Component; //-2
const output = Modules.FormsModule; //-3
const formControl = Modules.AngularForms.FormControl; //-4
const someVar1 = Modules.someVar; //-5
const someVar2 = Modules.someVar2; //-6

const class0 = new Modules.Class0(); //-7
const class1 = new Modules.Class1(); //-8
const class2 = new Modules.Class2(); //-9
const classDef2 = new Modules.ClassDef2(); //-11

import { default as Def } from '.';
const v = new Def(); //-10

如果您不是Angular开发人员,请使用您使用的任何名称重命名@angular。 命名index.ts仅允许您指定目录,而不指定文件名。