angular的目录结构

Question

我已经看到了angular.io上的目录结构，但我对他们提供的指导方针并不满意。通常，我们有可以在任何模块中使用的服务和模型，请查看以下结构

app
 |---modules
 |         |---account
 |         |         |---list-account.component.ts|html|css
 |         |         |---add-account.component.ts|html|css
 |         |---customer
 |                   |---list-customer.component.ts|html|css
 |                   |---add-customer.component.ts|html|css 
 |---services
 |          |---account.service.ts
 |          |---customer.service.ts
 |---models
 |        |---account.model.ts
 |        |---customer.model.ts

我尝试使用以下结构，但在typescript中导入文件时，相对urls太不清楚了。例如，如果我想要在add-account.component中导入account.model，import语句如下所示

// ../../ looks so wierd, is it a good practise?
import { AccountModel } from  '../../models/account.model';

// is it good practise to use absolute paths to import for typescript in angular?
import { AccountModel } from '~/models/account.model';

我想在所有组件和服务中重用我的模型。请给我推荐一些好的目录结构。任何帮助都是非常感谢的。

Answer 1

由John Papa设计的Angular风格指南，鼓励使用局部方式。所以你应该使用：

import { AccountModel } from  '../../models/account.model';

来源：Angular Style Guide