Javascript AngularJS项目结构

作为AngularJS的新手，我真的很想得到帮助，以最好的方式来组织我正在进行的项目

基本上，我有一个项目，我将在“PEAN”堆栈中进行（Postgres、Express、AngularJS、Node），并且需要一个关于它应该如何构造的概念性想法

其要点是，应用程序将有4种类型的用户帐户，每个登录用户将看到不同的视图。以下是功能集的简单示意图：

用户类型1:
导航
-功能1
-功能2
-专题3

用户类型2:
导航
-功能1
-功能2
-专题3

对于其他2个用户，依此类推

然而，用户可以访问的每个功能都是不同的。所以我的问题仍然是，对于客户端AngularJS应用程序，客户端将如何按目录进行结构化

另外，应该如何设置存储库

API和客户端代码的单一回购

我是否可以将API回购和客户端回购分开，并在一个客户端回购中包含所有用户帐户视图

我应该为每种类型的用户帐户建立客户端回购协议吗 对这些问题的回答将消除许多困惑，并将极大地帮助我。我已经为这样的应用程序的适当结构做了大量的研究，但似乎没有弄清楚

---

非常感谢您的帮助

我不能为您的项目的架构辩护，但我有过均值堆栈项目（本例中为PEAN）的结构经验

在这种情况下，我不会将您的项目分割成多个回购协议，将所有代码放在一个地方是很有帮助的。只要所有交易同时进行，就应该保持相同的回购协议。当您的项目没有同时运行，并且实际上是两个项目（如iOS应用程序和web应用程序）时，您应该将回购分开

我的基本文件结构通常如下所示：

. 
+-- app/ (all of your angular, dynamic web app code)
|   +-- controllers/
|   +-- directives/
|   +-- factories/
|   +-- views/
|   +-- templates/
|   +-- app.js
+-- server/ (all of your nodejs, server side code)
|   +-- controllers/
|   +-- models/
|   +-- routes/
+-- public/ (static assets)
|   +-- css/
|   +-- scripts/
|   +-- images/
+-- index.js (run the project)

---

我建议你到这里来：并遵循这里列出的指导方针。它有点过时，因为它还没有更新以涵盖组件，但大部分仍然适用

我还建议您在开始之前跳过控制器并查看组件

---

事实上，如果你有选择的话，因为你才刚刚开始，我会花很长时间和精力研究Angular 4，而不是用传统技术构建一个新的应用程序

文件夹结构因项目而异，因为人员不同，项目性质不同。 但无论您做什么，最终都会得到一些类似的文件夹结构，如下所示：-

• 您将需要两个根文件夹，一个用于服务器代码，另一个用于客户端代码。客户端代码文件夹有时也称为“应用程序”

• 如果您有一个大项目，那么在客户机文件夹中，您可以创建表示项目模块的子文件夹。通常，开发人员将项目划分为模块，以便更好地管理，所以这些子文件夹代表这些模块

• 在这个模块文件夹中，您可以为组件、模型、模块和布线设置单独的文件夹

• 还需要一个公共文件夹，您可以在其中推送公共实用程序，如公共管道、过滤器、http组件、可注入项等。 服务器文件夹将有自己的文件夹结构，这取决于您是在使用ASP.NET还是JSP或PHP。在本讨论中，我们将仅限于客户端角度文件夹结构

---

形象礼貌

当然，我也是这么想的。但是，在Angular“app”文件夹中呢？根据4种类型的用户视图，应该如何安排呢？@zbruno很好，我在我的图表中添加了子目录（在学习了如何制作图表lol之后）哦，你只需要在视图/文件夹（在我的结构中）中拥有每种视图。您可以使用app/app.js使用ng view呈现一个视图，我现在看到它正在一起呈现。不过还有一件事-请记住，有4种类型的用户帐户。有没有办法通过在应用程序文件夹中为每种类型的用户添加一个文件夹来分离每种帐户的功能？我个人会为每种用户类型创建一个新视图（在视图/中）。每个页面都不同，您可以连接到单独的控制器。每一页都有一个不同的URL。您现在可以在官方文档中找到他的Angular 2风格指南：