在单独的页面上包含Angular控制器

Question

我正在努力将现有的拼凑应用转换为Angular应用。该应用程序构建在CMS上，将“组件”捆绑在一起作为可在整个站点中重复使用的软件包，因此现在最有效的解决方案是将相关的JS作为内联<script>标记捆绑到一个独特的组件中并离开在一个单独的JS文件中的全局功能，该站点上的每个页面都共享。 CMS尚未与SPA合作。

我发现的一个障碍是我在所有页面的共享模板上声明ng-app="siteApp"（因此每个页面都有此应用程序）。

在组件的给定.html页面上，我有一个控制器ng-controller="RecipesCtrl"，并希望将其绑定到我的应用程序中。我无法在此内部页面上引用siteApp，即使它存在于全局上下文中：https://docs.angularjs.org/error/ $ injector / nomod？p0 = siteApp

如果我将所有过滤器/控制器包含在与siteApp相同的.js文件中，则可以正常工作。如果我将控制器放在siteApp之后加载的其他文件上，则找不到siteApp。有什么明显的东西我不见了吗？

感谢。

Answer 1

在不了解CMS的情况下，很难指责任何事情，只是尝试将事物分块到模块中并将它们作为依赖项注入siteApp。

全球JS档案

angular.module('siteApp', [
  'siteApp.recipes',
  'siteApp.ingredients',
  'siteApp.etc...'
]);

组件的JS文件

angular.module('siteApp.recipes')
.controller('RecipesCtrl', [function () {

}]);