未捕获的错误:使用 ng-repeat 时出现 [$injector:modulerr]

Uncaught Error: [$injector:modulerr] when using ng-repeat

本文关键字:injector modulerr ng-repeat 错误 使用      更新时间:2023-09-26

angular.module('app',[])
  .controller('myCtrl',function() {
    this.items = m;
});
var m = {
    "India": "4",
    "England": "2",
    "Brazil": "3",
    "UK": "1",
    "USA": "3",
    "Syria": "2"
};
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>
<body>
  <h3>FIFA Mactch Summary:</h3>
  <div ng-app='app' ng-controller="myCtrl">
      <ul>
          <li ng-repeat="(country,goals) in items">{{country}}: {{goals}}</li>
      </ul>
  </div>
</body>

以上是我的代码。当我运行它时,出现未捕获错误 [$injector:modulerr] 错误。我不知道为什么会出现此错误。有人可以帮助我吗?真的很感激。

为了访问 DOM 中的 Angular 属性,您需要建立一个作用域并将$scope作为依赖项注入控制器,方法是将其放置在函数参数中。然后,您需要将items分配给作用域对象上的某些内容,以便在 DOM 中访问它。为了使它工作,它应该看起来像这样。此外,我会避免像m对象这样漂浮在控制器之外的东西。如果您只在一个控制器中使用某些内容,我会说最好将信息保存在该控制器中。

angular.module('app',[])
  .controller('myCtrl', ['$scope', function($scope) {
    $scope.items = {
    "India": "4",
    "England": "2",
    "Brazil": "3",
    "UK": "1",
    "USA": "3",
    "Syria": "2"
    };
}]);
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>
<body>
  <h3>FIFA Mactch Summary:</h3>
  <div ng-app='app' ng-controller="myCtrl">
      <ul>
          <li ng-repeat="(country,goals) in items">{{country}}: {{goals}}</li>
      </ul>
  </div>
</body>