什么应该是项目中angularjs的最佳目录结构/体系结构

Question

我正在larvel5和angularjs开发一个新的大型项目，我只需要建议什么是angularjs在我的项目中组织代码的最佳目录结构。应该是{在我的项目中管理{1}}，modules，controllers和directive等。我的默认目录结构就像

factory

Answer 1

在此，有两个Web项目，一个是web api，另一个是客户端网页（SPA）。

您只需要一个空的Web项目来启动角度项目。

Index.html - 它是您的应用程序的主要html页面。项目的所有其他页面（部分页面）都可以放在目录页面中。

脚本 - 您的所有js文件都可以放在此目录中。您可以将所有js文件区分到它的子目录中。

Answer 2

理想的AngularJS应用程序结构应该模块化为非常具体的功能。我们还希望利用精彩的AngularJS指令进一步划分我们的应用程序。看一下下面的示例目录结构：

的index.html

index.html位于前端结构的根部。 index.html文件主要处理所有库和Angular元素的加载。

资产文件夹

assets文件夹也很标准。它将包含与您的AngularJS代码无关的应用程序所需的所有资产。有很多很好的方法来组织这个目录，但它们超出了本文的范围。上面的示例对于大多数应用来说已经足够了。

应用程序文件夹

这是AngularJS应用程序的核心所在。我们这里有两个子文件夹，文件夹的根目录下有几个JavaScript文件。 app.module.js文件将处理您的应用程序的设置，加载AngularJS依赖项等等。 app.route.js文件将处理所有路由和路由配置。之后我们有两个子文件夹 - 组件和共享。让我们深入了解下一个。

组件文件夹

components文件夹将包含Angular应用程序的实际部分。这些将是网站特定部分的静态视图，指令和服务（想想管理员用户部分，图库创建部分等）。每个页面都应该有自己的子文件夹，包含自己的控制器，服务和HTML文件。

此处的每个组件都具有视图，控制器和潜在的服务文件，类似于迷你MVC应用程序。如果组件有多个相关视图，那么将这些文件进一步分为“视图”，“控制器”，“服务”子文件夹可能是个好主意。

这可以看作是本文前面所示的更简单的文件夹结构，只是分为几个部分。因此，您可以将其视为巨型Angular应用程序中的多个迷你Angular应用程序。

共享文件夹

共享文件夹将包含您的应用所具有的各项功能。理想情况下，这些功能将是您希望在多个页面上重复使用的指令。

文章帖子，用户评论，幻灯片等功能应该被制作为AngularJS指令。这里的每个组件都应该有自己的子文件夹，其中包含指令JavaScript文件和模板HTML文件。

在某些情况下，指令可能拥有自己的服务JavaScript文件，如果是这样，它也应该进入这个子文件夹。

这使我们可以为我们的网站提供明确的组件，以便滑块成为整个网站的滑块。你可能想要构建它，以便你可以传入选项来扩展它。

您可以阅读here

中的详细文章

您还可以查看以下链接： Angularjs style guideline和 another article

Answer 3

为我的angularjs目录结构找到了解决方案。