在AngularJS ngRepeat指令获取集合名称

Question

如果我有，例如数组：

$scope.users = [ 
    John: { 
     age: 18, 
     genre: 'male', 
     type: 'admin' 
    }, 
    Paul: { 
     age: 22, 
     genre: 'male', 
     type: 'admin' 
    } 
]; 

我怎样才能获得用户名时，我ngRepeat循环？

<li ng-repeat="user in users"> 
    {{ }} <!-- Name Here --> 
    {{ user.age }} <br> 
    {{ user.genre }} <br> 
    {{ user.type }} 
</li> 

谢谢！

Answer 1

1）你在你的代码错误：您的阵列应该是一个对象，因为它具有键John, Paul ...

2）ngRepeat可以iterate over object properties like (key, value) in obj

下面是工作示例：

angular.module('myApp', []) 
 
.controller('MyCtrl', ['$scope', function MyCtrl($scope) { 
 
    var ctrl = this; 
 
    
 
    ctrl.users = { 
 
     John: { 
 
      age: 18, 
 
      genre: 'male', 
 
      type: 'admin' 
 
     }, 
 
     Paul: { 
 
      age: 22, 
 
      genre: 'male', 
 
      type: 'admin' 
 
     } 
 
    }; 
 
    
 
    
 
}]);

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="//code.angularjs.org/1.6.2/angular.js"></script> 
 

 
<div ng-app="myApp"> 
 
    <div ng-controller="MyCtrl as $ctrl"> 
 
    <ul> 
 
     <li ng-repeat="(key, user) in $ctrl.users track by $index"> 
 
     {{ key }} 
 
     {{ user.age }} <br> 
 
     {{ user.genre }} <br> 
 
     {{ user.type }} 
 
     </li> 
 
    </ul> 
 
    </div> 
 
</div>

Answer 2

您可以使用Object.keys(users)得到一个数组的值[“保”，“约翰”]

<li ng-repeat="user in users track by $index"> 
    {{ Object.keys(users)[$index] }} 
    {{ user.age }} <br> 
    {{ user.genre }} <br> 
    {{ user.type }} 
</li> 

这不是测试，但我认为这应该是一起的，你需要什么样的线。

Answer 3

首先，所有阵列都不能有自定义键。所以我想你正在使用object $ scope.users。

而对于答案，你可以这样做：NG重复= “（名称，用户）的用户”

https://docs.angularjs.org/api/ng/directive/ngRepeat#iterating-over-object-properties