javascript - Angular js $范围错误

Question

我尝试使用种子应用程序开始使用 angular.js。

当浏览器执行我的 Controller 时，出现以下错误:

TypeError: Cannot set property 'players' of undefined
at new bankC (http://localhost:8888/monopoly/js/controllers.js:18:20)
at invoke (http://localhost:8888/monopoly/lib/angular/angular.js:2795:28)
at Object.instantiate (http://localhost:8888/monopoly/lib/angular/angular.js:2805:23)
at http://localhost:8888/monopoly/lib/angular/angular.js:4620:24
at update (http://localhost:8888/monopoly/lib/angular/angular.js:13692:26)
at http://localhost:8888/monopoly/lib/angular/angular.js:8002:24
at Array.forEach (native)
at forEach (http://localhost:8888/monopoly/lib/angular/angular.js:110:11)
at Object.Scope.$broadcast (http://localhost:8888/monopoly/lib/angular/angular.js:8000:11)
at http://localhost:8888/monopoly/lib/angular/angular.js:7185:26 

这是controller.js文件中的 Controller 代码

function bankC($scope) {
  $scope.players = [
      {
        id: 0,
        name: "Playe1",
        balance: 1500
      },
      {
        id: 1,
        name: "Player2",
        balance: 1500
      },
      {
        id: 2,
        name: "Player 3",
        balance: 1500
      }
  ];
}
bankC.$inject = [];

谢谢

编辑:

它在特定“页面”上使用 angular js 注册

angular.module('myApp', ['myApp.filters', 'myApp.services', 'myApp.directives']).
config(['$routeProvider', function ($routeProvider) {
    $routeProvider.when('/view1', {templateUrl: 'partials/partial1.html', controller: MyCtrl1});
    $routeProvider.when('/view2', {templateUrl: 'partials/partial2.html', controller: MyCtrl2});
    $routeProvider.when('/bank', {templateUrl: 'partials/bank.html', controller: bankC});
    $routeProvider.otherwise({redirectTo: '/bank'});
}]);

编辑2:

删除“bankC.$inject = [];”从 Controller 文件解决了这个问题，那么为什么 angular.js 种子应用程序包含它？

Answer 1

你因为最后一行而收到那个错误

bankC.$inject = [];

这告诉 Angular 注入(inject)器在 Controller 寻找 $scope 时不向 Controller 注入(inject)任何东西。

如果你把这个改成

bankC.$inject = ['$scope'];

它应该可以正常工作。

最后一行的存在是因为 Angular 使用了依赖注入(inject)。当你在 Controller 中请求时，Angular 会查找名称为 $scope 的变量。但是，如果代码被缩小，那么混淆会将 $scope 的名称更改为其他名称。为了在发生这种情况时保持理智，引入了最后一行。每当您声明一个新 Controller 时，最佳做法是在最后一行包含您希望 angulars DI 注入(inject)该 Controller 的所有变量。

注意:如果您有兴趣将更多东西注入(inject)该 Controller (或类似 Controller )，那么您还必须更新 bankC.$inject。