使用ng-repeat解析不均匀的数据/ json对象

fiddle here http://jsfiddle.net/prantikv/1nvdzv24/9/

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

i have some uneven data like so

我有一些不均匀的数据,如此

[{
   "fname": "Tonja", //common
    "lname": "Mize",
    "tel": "[phone]",
    "address": "3999 Quis Ln",
    "city": "Sebring",
    "state": "MI",
    "zip": 76593
},
{
    "fname": "Stella", //common
    "Othername": "Lester",
    "mobile": "[phone]"
}];

notice only the fname property is common between the two objects

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

so when i do this

所以当我这样做

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

i do get the fname but the data is uneven so i cannot figure out how to go through over each object. also the length of the object is different as well.

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

what i want to do is to filter the data over a select list

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

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

but i am unable to figure out a way to display the unmatched properties of objects is there a way i get all the key:value pairs on the sub data dynamically?

但我无法找到一种方法来显示对象的不匹配属性是否有一种方法可以动态获得子数据上的所有关键:值对?

1 个解决方案

#1

WORKING DEMO

Your 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": "[phone]",
    "address": "3999 Quis Ln",
    "city": "Sebring",
    "state": "MI",
    "zip": 76593
     },
     {
    "fname": "Stella", //common
    "Othername": "Lester",
    "mobile": "[phone]"
   }];
});