javascript - 使用 ng-repeat 解析不均匀的 data/json 对象

Question

在这里摆弄http://jsfiddle.net/prantikv/1nvdzv24/9/

我有一些不均匀的数据，像这样

[{
   "fname": "Tonja", //common
    "lname": "Mize",
    "tel": "(963)784-1098",
    "address": "3999 Quis Ln",
    "city": "Sebring",
    "state": "MI",
    "zip": 76593
},
{
    "fname": "Stella", //common
    "Othername": "Lester",
    "mobile": "(936)898-2886"
}];

请注意，只有 fname 属性在两个对象之间是通用的

所以当我这样做时

  <li ng-repeat="(key,val) in populationList | filter:name"> 
 {{ val.**fname**}} 
</li>

我确实得到了 fname，但数据不均匀，所以我无法弄清楚如何遍历每个对象。物体的长度也不同。

我想要做的是通过选择列表过滤数据

<select ng-model="name">
    <option value="Tonja" selected="Tonja">Tonja</option>
    <option value="Stella">Stella</option>
</select>

但我无法找到一种方法来显示对象的不匹配属性 有没有办法动态获取子数据上的所有键:值对？

Answer 1

WORKING DEMO

您的 HTML，

<div ng-app='app'>
 <div ng-controller="DemoCtrl">
    <select ng-options="item.fname for item in populationList | fieldList:'fname'" ng-model="myItem" ng-change="changeSelection(myItem)">
    </select>

   <li ng-repeat="key in availableKeys"> 
         {{selectedObject[key]}} 
    </li>
 </div>
</div>

JS

angular.module('filters',[]).
  filter('fieldList', function() {
      return function(populationList, parameter) {
        var filteredArray = [];
        angular.forEach(populationList, function(value, index) {
             if(value.hasOwnProperty(parameter)) {
                 filteredArray.push(value);
             }
        });
        return filteredArray;
      };
    });


angular.module('app',['filters'])
  .controller('DemoCtrl', function($scope) {
  $scope.changeSelection = function(item) {
    $scope.selectedObject = item;
    $scope.availableKeys = Object.keys($scope.selectedObject);
    };
  $scope.populationList = [{
    "fname": "Tonja", //common
    "lname": "Mize",
    "tel": "(963)784-1098",
    "address": "3999 Quis Ln",
    "city": "Sebring",
    "state": "MI",
    "zip": 76593
     },
     {
    "fname": "Stella", //common
    "Othername": "Lester",
    "mobile": "(936)898-2886"
   }];
});