Question

我必须开发一个布局组件，它包含三个部分：toolbar，sidebar和content：

它的三个部分中的每一部分也是一个组成部分。

我的问题是我应该如何构建复合布局组件的文件。目前，我有这样的结构：

app
│
├───content
│       content.component.html
│       content.component.less
│       content.component.spec.ts
│       content.component.ts
│
├───layout
│       layout.component.html
│       layout.component.less
│       layout.component.spec.ts
│       layout.component.ts
│
├───sidebar
│       sidebar.component.html
│       sidebar.component.less
│       sidebar.component.spec.ts
│       sidebar.component.ts
│
└───toolbar
        toolbar.component.html
        toolbar.component.less
        toolbar.component.spec.ts
        toolbar.component.ts

在阅读了Angular的style guide之后，看起来平面结构比另一个更受欢迎：

app
│
│
└───layout
        layout.component.html
        layout.component.less
        layout.component.spec.ts
        layout.component.ts
            │
            │
            ├───content
            │       content.component.html
            │       content.component.less
            │       content.component.spec.ts
            │       content.component.ts
            │
            ├───sidebar
            │       sidebar.component.html
            │       sidebar.component.less
            │       sidebar.component.spec.ts
            │       sidebar.component.ts
            │
            └───toolbar
                    toolbar.component.html
                    toolbar.component.less
                    toolbar.component.spec.ts
                    toolbar.component.ts

但我认为第二个更有意义，因为我不打算在任何其他地方使用toolbar，sidebar和content组件。事实上，我甚至不知道他们的名字是否应该以{{1}}字（layout，layout-toolbar和layout-sidebar）为前缀。

在这种情况下，构建代码的推荐方法是什么？

Answer 1

最后，这完全取决于你。从平面开始，随着应用程序的增长，创建目录以保持一切井井有条。我也更喜欢你的第二种方法;将逻辑上等效的组件组合在一起。一篇很好的文章可以帮助您构建：Angular Folder Structure

Angular中容器组件的文件结构

1 个答案: