本文介绍了ionic2 的页面可以支持嵌套目录结构吗?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我看到很多 Ionic 2 项目的 pages 目录是一个扁平结构,如下图(如果我们使用它的生成命令,生成的目录结构是扁平的).

I see the pages directory of many Ionic 2 projects is a flatted structure like below (if we use its generation command, the generated directory structure is flatted).

例如

    pages/
      |- login/
      |    |-login.html
      |    |-login.scss
      |    |_login.ts
      |- logout/
      |    |-logout.html
      |    |-logout.scss
      |    |_logout.ts
      |- order-list/
      |    |-order-list.html
      |    |-order-list.scss
      |    |_order-list.ts
      |- order-detail/
      |    |-order-detail.html
      |    |-order-detail.scss
      |    |_order-detail.ts

但是如果一个项目包含很多页面,我希望 pages 目录支持如下子目录:

But if a project includes many pages, i hope the pages directory supports sub directories like below:

例如

    pages/
      |- auth/
      |     |- login/
      |     |    |-login.html
      |     |    |-login.scss
      |     |    |_login.ts
      |     |- logout/
      |     |    |-logout.html
      |     |    |-logout.scss
      |     |    |_logout.ts
      |- order/
      |     |- list/
      |     |    |-list.html
      |     |    |-list.scss
      |     |    |_list.ts
      |     |- detail/
      |     |    |-detail.html
      |     |    |-detail.scss
      |     |    |_detail.ts

Ionic 2 的 pages 支持这个吗?providerspipes 等其他目录也有同样的问题.

Does Ionic 2's pages support this? The same question to others directory like providers and pipes.

推荐答案

当然可以.事实上,与其按照它们是什么(页面、提供者、管道、指令等)对事物进行分组,我更喜欢按照它们的作用对它们进行分组 就像 Angular 2 风格指南 推荐的那样.

Of course it does. In fact, instead of grouping things in terms of what they are (pages, providers, pipes, directives, and so on) I do prefer to group them in terms of what they do just like Angular 2 style guides recommends.

按功能分类的文件夹结构样式 04-07

创建以它们所代表的功能区域命名的文件夹.

Do create folders named for the feature area they represent.

为什么?开发人员可以定位代码,识别每个文件的内容一目了然,结构尽可能平坦,并且没有重复或冗余的名称.

Why? A developer can locate the code, identify what each file represents at a glance, the structure is as flat as it can be, and there is no repetitive nor redundant names.

为什么?LIFT 指南均已涵盖.

Why? The LIFT guidelines are all covered.

为什么?通过组织帮助减少应用程序变得混乱内容并使其与 LIFT 指南保持一致.

Why? Helps reduce the app from becoming cluttered through organizing the content and keeping them aligned with the LIFT guidelines.

为什么?当有很多文件(例如 10+)时,定位它们更容易具有一致的文件夹结构,并且在平面中更难结构.

Why? When there are a lot of files (e.g. 10+), locating them is easier with a consistent folder structure and more difficult in a flat structure.

请记住,您必须更新所有文件以及组件 templateUrl 属性中的引用(如果您使用RC 版本).所以

Just keep in mind that you'll have to update the references both in all the files and also in the components templateUrl property (if you're not using the RC version). So

@Component({
  templateUrl: 'build/pages/login/login.html',
  pipes: [ ... ],
  directives: [ ... ]
})
...

会变成:

@Component({
  templateUrl: 'build/pages/auth/login/login.html',
  pipes: [ ... ],
  directives: [ ... ]
})
...

这篇关于ionic2 的页面可以支持嵌套目录结构吗?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

07-24 15:52