界面无法在角度2模块中导出？

Question

我试图在NgModule声明中导出一个接口并导出并在编辑器中获取此错误(Visual Studio代码): [ts] 'MyInterface' only refers to a type, but is being used as a value here.

这是示例代码Edit-1:

import { NgModule }           from '@angular/core';
import { CommonModule }       from '@angular/common';
import { FormsModule }        from '@angular/forms';
import { MaterialModule }     from '@angular/material';
import { MyInterface }        from './my.interface';
import { MyService }          from './my.service';

@NgModule({
  imports:      [ CommonModule, FormsModule,  MaterialModule.forRoot()  ],
  declarations: [ MyInterface],//<- this is causing the message
  exports:      [ MyInterface],
  providers:    [ MyService ]
})
export class MyModule { }

我在这篇文章的答案中找到的解释的一部分:"因为接口在运行时在TypeScript中被擦除".我目前正在将我的应用程序重构为功能模块,因此我现在无法对其进行测试:我是否可以仅通过从'./mypathto/my.interface'导入来使用这些接口？

Answer 1

您无法导出界面.你只能导出:

1. 其他模块
2. 组件
3. 指令
4. 管道

NgModule是一个角度概念,不应该与打字稿模块混淆.要使使用您的模块的第三方能够使用您的界面,您应该.d.ts使用您的模块创建一个定义文件.

如果你想在你的另一个NgModule中使用一个接口,你应该使用:

import {InterfaceName} from 'path/to/ngmodule/to/interface';

另外,不要在声明数组中放置接口,这仅用于管道/组件/指令.

如果您希望您的界面在库外可用,您应该将其添加到您的导出index.ts:

export {InterfaceName} from 'path/to/ngmodule/to/interface';

Answer 2

实际上你可以导出一个界面,但不是你想要的方式.

首先通过键入生成interfaces.ts文件

ng g interface <interface_name>

接口文件示例:

export interface Auction{ $key?:string; $auctioneer:string;  ... }
export interface Item{ $key?:string; condition?:string; description?:string; ...}
export interface Bid{  $key?:string;  amount:number;  auction:string; ...}

根据需要修改文件后,您只需导入一个,所有或选择的接口,如下所示:

import { Auction } from './interfaces';

要么

import * as interfaces from './interfaces'; 
// then you have to call interfaces.Auction

如果有机会你知道如何在全球范围内共享接口.让我知道:Angular如何在应用程序之间共享界面