Question

如果我有这样的文件结构：

应用
- 模型
  - model1.ts
  - model2.ts
  - model3.ts
  - index.ts
- 服务
  - serviceGroup1
  - serviceGroup1Service1.ts
  - serviceGroup1Service2.ts
  - index.ts
  - serviceGroup2
  - serviceGroup3
  - index.ts

tsconfig.json：

"compilerOptions": {
    "declaration": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "mapRoot": "/",
    "module": "commonjs",
    "moduleResolution": "node",
    "noEmitOnError": true,
    "noImplicitAny": false,
    "outDir": "../dist/",
    "rootDir": ".",
    "sourceMap": true,
    "target": "es5",
    "inlineSources": true
}

如何公开所有模型并将其导入如下： serviceGroup1Service1.ts：

import * as models from 'models';

更新了文件树

更新文件

为system.config.ts添加了新的barell。

'app',
'app/models',
'app/services'

尝试在serviceGroup1Service1.ts中使用

import * from 'app/models'

出现错误＆＃34;无法找到模块＆＃39; app / models＆＃39;

但是

import { Component } from '@angular/core'

运作良好。如何为我的组件做到这一点？

Answer 1

添加app/models.ts：

export * from './models/model1`
export * from './models/model2`
export * from './models/model3`

现在您可以使用以下内容导入它们：

import * as models from 'app/models';

如果您只想使用models而不是app/models，则应添加SystemJS地图配置，例如：

System.config.map = { models: 'app/models' }

Answer 2

以前的答案有效，但我注意到angular2模式似乎是＆＃34; barrels＆＃34;你可以在模型目录中拥有一个index.ts，用于从xxx＆＃34;＆＃34; export *;对于每个文件，然后您从./models/"导入*。这两种方法都有效，只是我注意到的模式。

可能有一些内置的支持来生成它们（可能在angular-cli中？当我用它来创建组件时它会生成它们），我只需要一对并手动生成它们。 / p>

Angular 2 typescript导入到深层目录

2 个答案: