角度错误错误：[ng:areq]答案

【问题标题】：Angular error Error: [ng:areq]角度错误错误：[ng:areq]
【发布时间】：2015-10-25 11:47:05
【问题描述】：

我是 Angular 的新手，我想知道我的代码有什么问题，因为浏览器会显示这个错误：错误：[ng:areq] http://errors.angularjs.org/1.4.7/ng/areq?p0=HelloWorldCtrl&p1=not%20a%20function%2C%20got%20undefined 在错误（本机）

y el codigo es este：

    <!doctype html>
<html ng-app>
<head>
    <title>Angular Practice</title>
</head>
<body>
    <h1 ng-controller="HelloWorldCtrl">{{helloMessage}}</h1>

    <script src="angular.min.js"></script>
    <script type="text/javascript">
        function HelloWorldCtrl($scope) {
            $scope.helloMessage = "Angular Practice";
        }
    </script>
</body>
</html>

非常感谢。

【问题讨论】：

标签： javascript angularjs

【解决方案1】：

您的 HelloWorldCtrl 未定义。

这是因为您没有将其绑定为带有控制器的角度模块。

ng-controller 寻找这样的定义：

angular.module('HelloWorldCtrl', [])

    .controller('HelloWorldCtrl', function($scope){
        $scope.helloMessage = "Angular Practice";
    });

该控制器还需要分配给主应用程序，您需要在该 ng-app 指令上引用它，即

<html ng-app="helloWorldApp">

应该指向你这样创建的模块：

var helloWorldApp = angular.module('helloWorldApp ', [
    'HelloWorldCtrl'
])

注意，我将“HelloWorldCtrl”引用作为该模块定义的第二个参数的项目。这告诉 Angular 将该控制器作为资源加载，然后您可以通过该 ng-controller 指令引用该资源。

编辑：

对我提到在上面的数组中添加“HelloWorldCtrl”作为项目进行了一些研究，并想详细说明为什么我的解决方案与此处的其他答案略有不同。我设置它的方式是“HelloWorldCtrl”是一个单独的模块。在这种情况下，您确实需要以我的方式引用它。这告诉应用程序模块它依赖于“HelloWorldCtrl”模块。在下面的答案中，我将该控制器直接绑定到应用程序，在这种情况下，这不是必需的。

【讨论】：

【解决方案2】：

使其工作的步骤，

将 ng-app 指令添加到您的 <html> 标签中
在下面的脚本中定义您的模块app。
如下定义您的控制器HelloWorldCtrl。

检查这个 Plunker - http://plnkr.co/edit/w8RWm6nr1WgvhX3BbGUE?p=preview

!DOCTYPE html>
    <html ng-app="app">

      <head>     
        <script src="http://apps.bdimg.com/libs/angular.js/1.4.0-beta.4/angular.min.js"></script>       
      </head>

         <h1 ng-controller="HelloWorldCtrl">{{helloMessage}}</h1>    

        <script type="text/javascript">
          angular.module('app', []);
          angular.module('app').controller('HelloWorldCtrl', [ '$scope', function($scope) {
            $scope.helloMessage = "Angular Practice";

          }]);
        </script>

    </html>

【讨论】：