Question

我正在使用AngularJS开发一个Web应用程序，我刚刚开始学习它。我发现它非常有用，但经过几天的工作后，我认为该应用程序迟早会搞砸，因为我在一个控制器中编写了所有“后端”代码。该应用程序使用大量$ http请求从/向远程服务器获取/发布/删除/放置数据，以及以某种方式操作页面所需的许多范围变量。

我在AngularJS上检查了很多教程/信息站点（例如similar question，great blog post），但我仍然不确定如何在我的应用程序中实现我自己的一个。我想知道使用自己的服务/模块/指令/工厂的常见情况是什么？我希望稍微重构我的代码，这样一切都会变得更有条理;目前我认为我没有完全利用AngularJS将我的所有代码放在一个地方，除了我的主应用程序模块和控制器以及内置的$ http之外没有使用任何服务/模块。

所以你可以更好地理解我的问题，到目前为止我只使用两个javascript文件，第一个是app.js：

var app = angular.module('MyAppName',[]);

，第二个是controller.js（我当然只能使用1个文件）：

app.controller("MyController", function($scope, $http){
    // all my functions/variables in here
   // I initialize them  with $scope.someName = … if they are needed within this controller view.
  //  If they are not needed within view I initialize them (functions for instance)
 // as functionName = function(){};
}

一切都按照这种方式工作，但我认为这种方法并没有使用AngularJS的所有功能。例如：我不使用路由，我可能应该这样做（网址始终保持不变）。我也不使用angularJS的任何其他高级功能，例如自定义服务/指令/模块。

所以我问：我如何重构我的代码，以便它使用更多的AngularJS功能并使其保持可读性？您何时通常创建自己的服务/模块/工厂？我有点没有把握AngularJS网站上的所有内容，可能是因为我在知识不足的情况下开始开发得太早，现在我很难得到它（太过于双向绑定并立即开始编码）。

对此主题的任何帮助表示赞赏。

修改好的，我知道我应该清楚一些事情：我的主要问题不是外部文件夹/文件结构，而是代码结构本身。现在我有一个控制器，它包含我的web应用程序中使用的每个变量（30+）和函数，例如登录功能，注销功能，显示/隐藏页面部分的功能，向/从服务器添加/删除数据的功能等等… 我希望能够以某种方式将这些函数/变量构造为一些独立的部分，但我不确定如何。

EDIT2： 我想到了如何使用服务，但遗憾的是你不能在视图中调用服务函数，例如直接用ng-click ...你只能调用$ scope变量，这实际上是合乎逻辑的...不幸的是我还是不知道如何组织我的代码看起来更具可读性和结构性