ng-repeat错误。无法读取未定义的属性

Question

我有两个错误说：Cannot read property 'active' of undefined和Cannot read property 'boss' of undefined而我试图在我的用户数组上使用ng-repeat。

在控制器中我用下面的代码：

  $scope.users = [ 
      { 
       id: 1, 
       name: 'John', 
       birthday: '06.07.2008', 
       city: 'Budapest', 
       active: false, 
       boss: false 
      }, 
      { 
       id: 2, 
       name: 'Mary', 
       birthday: '01.02.2003', 
       city: 'Berlin', 
       active: false, 
       boss: true 
      }, 
      { 
       id: 3, 
       name: 'James', 
       birthday: '04.05.2006', 
       city: 'Vienna', 
       active: false, 
       boss: false 
      } 
     ]; 

     $scope.isActive = function (id) { 
      return $scope.users[id].active; 
     } 

     $scope.isBoss = function (id) { 
      console.log($scope.users[id]); 
      return $scope.users[id].boss; 
     } 

在视图我有以下代码：

<thead> 
     <tr> 
      <th>#</th> 
      <th>Username</th> 
      <th>Birthday</th> 
      <th>City</th> 
      <th>Active</th> 
      <th>Boss</th> 
     </tr> 
    </thead> 
    <tbody> 
     <div> 
      <tr ng-click="goToProfile(user.id)" ng-repeat="user in users"> 
       <td>{{user.id}}</td> 
       <td>{{user.name}}</td> 
       <td>{{user.birthday}}</td> 
       <td>{{user.city}}</td> 
       <td> 
        <input type="checkbox" name="active" ng-checked="{ checked: isActive(user.id) }"> 
       </td> 
       <td> 
        <input type="radio" name="boss" ng-checked="{ checked: isBoss(user.id) }"> 
       </td> 
      </tr> 
     </div> 
    </tbody> 

在结束它打印的表格以正确的方式也抛出这些错误。我错过了什么？

而且，这里的渲染结果：

<tbody> 
    <!-- ngRepeat: user in users --> 
    <tr ng-click="goToProfile(user.id)" ng-repeat="user in users" class="ng-scope"> 
     <td class="ng-binding">1</td> 
     <td class="ng-binding">John</td> 
     <td class="ng-binding">06.07.2008</td> 
     <td class="ng-binding">Budapest</td> 
     <td> 
      <input type="checkbox" name="active" ng-checked="{ checked: isActive(user.id) }" checked="checked"> 
     </td> 
     <td> 
      <input type="radio" name="boss" ng-checked="{ checked: isBoss(user.id) }" checked="checked"> 
     </td> 
    </tr> 
    <!-- end ngRepeat: user in users --> 
    <tr ng-click="goToProfile(user.id)" ng-repeat="user in users" class="ng-scope"> 
     <td class="ng-binding">2</td> 
     <td class="ng-binding">Mary</td> 
     <td class="ng-binding">01.02.2003</td> 
     <td class="ng-binding">Berlin</td> 
     <td> 
      <input type="checkbox" name="active" ng-checked="{ checked: isActive(user.id) }" checked="checked"> 
     </td> 
     <td> 
      <input type="radio" name="boss" ng-checked="{ checked: isBoss(user.id) }" checked="checked"> 
     </td> 
    </tr> 
    <!-- end ngRepeat: user in users --> 
    <tr ng-click="goToProfile(user.id)" ng-repeat="user in users" class="ng-scope"> 
     <td class="ng-binding">3</td> 
     <td class="ng-binding">James</td> 
     <td class="ng-binding">04.05.2006</td> 
     <td class="ng-binding">Vienna</td> 
     <td> 
      <input type="checkbox" name="active" ng-checked="{ checked: isActive(user.id) }"> 
     </td> 
     <td> 
      <input type="radio" name="boss" ng-checked="{ checked: isBoss(user.id) }"> 
     </td> 
    </tr> 
    <!-- end ngRepeat: user in users --> 

</tbody> 

Answer 1

那是因为你的isActive和isBoss功能被传递user.id。我观察到user.id从id 1开始，同时在这些函数中，您尝试使用传入的索引访问$scope.users。例如，函数中user.id的user.id会尝试访问$scope.users[3].active。但是，实际上是没有索引3（代表$scope.users数组中的第四个项目，这是undefined）

更改..isActive(user.id)到...isActive($index)和你...isBoss(user.id)到...isBoss($index)