Angular 的 ng-view 中的控制器定义答案

【问题标题】：Controller definition inside Angular's ng-viewAngular 的 ng-view 中的控制器定义
【发布时间】：2015-05-21 06:24:09
【问题描述】：

我有一个使用 ngRoute 模块的 Angular 1.3 应用程序。我希望能够在与视图相同的文件中定义一个控制器，但由于某些原因，Angular 无法识别它：

view.html：

<script>
  angular.module("app").controller("fooController", function() {});
</script>
<div ng-controller="fooController"></div>

module.js：

angular.module("app", ["ngRoute"]);
// ...

index.html：

<!-- ... -->
<body>
    <div ng-view></div>
    <script src="angular.js"></script>
    <script src="angular-route.js"></script>
    <script src="module.js"></script>
</body>
<!-- ... -->

上述设置抛出错误：Argument 'fooController' is not a function, got undefined.

Tt 在 1.3 之前有效，此时控制器可以定义为全局函数。 另外，在模块配置过程中调用$controllerProvider.allowGlobals();并将控制器定义为全局函数时也不会出现问题。

我知道在 HTML 文件中定义控制器不是最好的主意，但在这种情况下我有充分的理由这样做。

我们将不胜感激。

编辑：这是显示问题的 plunker：http://plnkr.co/edit/JU350xL7X9ryF3S72o6s

点击那里的链接更改路由并查看浏览器的控制台。

【问题讨论】：

不确定，但也许您需要在脚本之后添加ng-view，因为在view.html 中，全局对象angular 尚未加载。
它已经加载了。否则会报错。

标签： javascript angularjs

【解决方案1】：

我为此在 Github 上创建了一个问题：https://github.com/angular/angular.js/issues/11384。事实证明（目前）不支持这种情况。

【讨论】：

【解决方案2】：

该错误表明当您/Angular 首次尝试使用控制器时，控制器尚未实例化。

我的猜测是您在 ngRoute 定义中引用了控制器，而 ngRoute 模块试图在显示您的视图之前覆盖控制器依赖关系。

如果您要更新您的问题以包含路线配置，那可能会更明显。一个工作（或不工作）的 Plnkr.co 演示会更好。

【讨论】：

当然，我在 plunker 上添加了一个示例。我没有在模块配置函数中引用控制器，所以理论上这应该可以工作......