Question

我在教程视频中看到了这个基本的AngularJS代码，它提供了预期的输出。但是当我在本地尝试相同的代码时它不起作用，它会显示{{message}}作为输出。

<!DOCTYPE html>
<html lang="en" ng-app>
<head>
    <title></title>
</head>
<body>
    <h1 ng-controller="HelloWorldCtrl">{{message}}</h1>
    <script src="Scripts/angular.min.js"></script>
    <script type="text/javascript">

        function HelloWorldCtrl($scope)
        {
            $scope.message = "First Run...";
        }

    </script>
</body>
</html>

在控制台中显示错误

Argument 'HelloWorldCtrl' is not a function, got undefined

错误：[ng：areq] http://errors.angularjs.org/1.3.0-rc.2/ng/areq?p0=HelloWorldCtrl&p1=not%20a%20function%2C%20got%20undefined

为什么同样的代码在不同的环境中表现不同？有人可以指出我在这里缺少的东西吗？

Answer 1

angular1.3.rc2中有些变化！ http://jsbin.com/sumifozawiji/1/edit

我得到了同样的错误。 1.2.25作品： http://jsbin.com/lanavuvaniva/1/edit

Answer 2

由于全局范围内定义控制器构造函数的Angular v1.3.0-beta是 no longer supported 。

Answer 3

Angular将运行，它将自动引导（因为ng-app属性）并期望找到名为HelloWorldCtrl的控制器（由于ng-controller="HelloWorldCtrl"）。但是这个控制器是在 Angular之后定义的，所以它在执行时就不存在了。

最简单的解决方案是更改脚本的顺序，即将代码置于Angular之前。

全局范围内的控制器构造函数不起作用

3 个答案: