AngularJS 应用中未识别的 ng-controller 问题

Question

我正在尝试一些初步的东西来适应 AngularJS。我当前的来源是 SoloLearn。我尝试重新创建他们的应用程序，当单击按钮时，它会将 +1 添加到计数器。

我已经尝试检查他们应用程序中的代码，我也将他们的工作复制并粘贴到我的 HTML 文件中，但它仍然不起作用，我尝试了 an online tool for ascii diffs 和我的代码应该是相同的，但我的检查员产生了这个：

http://errors.angularjs.org/1.6.4/$controller/ctrlreg?p0=clickCounter
at angular.js:38
at angular.js:10839
at ba (angular.js:9931)
at n (angular.js:9701)
at g (angular.js:9055)
at g (angular.js:9058)
at g (angular.js:9058)
at angular.js:8920
at angular.js:1919
at m.$eval (angular.js:18161)

我检查了 site，据我所知，我的代码应该仍然可以工作，但现在不行。

我的代码：

<div ng-app="MyApp" ng-controller="myCtrl">
    <button ng-click="count=count+1">Click me!</button>
    <p> {{count}} </p>
</div>
<script>
    var app = angular.module('MyApp',[])
    app.controller('myCtrl', function($scope) {
        $scope.count=0;
    });
</script>

他们的代码：

<div ng-app="myApp" ng-controller="clickCounter">
        <button ng-click="count=count+1">Click me!</button>
        <p>{{ count }}</p>
</div>
<script>
    var app = angular.module('myApp', []);
    app.controller('clickCounter', function($scope) {
        $scope.count = 0;
    });
</script>

感谢您的帮助！

Answer 1

我在不同的 plunker 中都添加了，都在工作

http://plnkr.co/edit/Pk8bY3jMiRqwiyWhxEkn?p=preview

http://plnkr.co/edit/aJZTXMQ1dATZI4XUSCmc?p=preview

<div ng-app="myApp" ng-controller="clickCounter">
    <button ng-click="count=count+1">Click me!</button>
    <p>{{ count }}</p>

 var app = angular.module('myApp', []);
app.controller('clickCounter', function($scope) {
    $scope.count = 0;
});

Answer 2

正如@Lex 提到的，我需要专门为运行的应用程序定义 Angular 应用程序，而不是将它们全部塞进同一个地方。我发布的第一个 URL 上的代码现在可以使用了。基本上将 body 标签更改为：<body ng-app=""> 并命名每个 div 应用程序使一切正常。谢谢大家的帮助。

AngularJS 应用中未识别的 ng-controller 问题

Unidentified ng-controller issue in AngularJS app

angularjs

angularjs-controller