Wie kann man über die Schlüssel und Werte mit ng-repeat in AngularJS iterieren?

Question

In meinem Controller habe ich Daten wie: $scope.object = data

Jetzt sind diese Daten das Wörterbuch mit Schlüsseln und Werten aus json.

Ich kann auf das Attribut mit object.name im Template zugreifen. Gibt es einen Weg, über die Schlüssel zu iterieren und sie auch in einer Tabelle anzuzeigen, wie

{{key}} data.key

Die Daten sehen so aus

{
    "id": 2,
    "project": "wewe2012",
    "date": "2013-02-26",
    "description": "ewew",
    "eet_no": "ewew",
}

Answer 1

Was ist mit:

     {{key}}   {{ value }} 

Diese Methode ist in der Dokumentation aufgeführt: https://docs.angularjs.org/api/ng/directive/ngRepeat

Answer 2

Wenn Sie den Eigenschaftswert mit zweiweg Bindung bearbeiten möchten:

    {{key}}

Answer 3

Ich glaube nicht, dass es eine eingebaute Funktion in Angular gibt, um dies zu tun, aber Sie können dies tun, indem Sie eine separate Scope-Eigenschaft erstellen, die alle Überschriften enthält, und Sie können diese Eigenschaft automatisch wie folgt füllen:

var data = {
  foo: 'a',
  bar: 'b'
};

$scope.objectHeaders = [];

for ( property in data ) {
  $scope.objectHeaders.push(property); 
}

// Output: [ 'foo', 'bar' ]

Answer 4

Wir können das folgende Verfahren befolgen, um die Anzeige von Schlüsselwerten in alphabetischer Reihenfolge zu vermeiden.

Javascript

$scope.data = {
   "id": 2,
   "project": "wewe2012",
   "date": "2013-02-26",
   "description": "ewew",
   "eet_no": "ewew",
};
var array = [];
for(var key in $scope.data){
    var test = {};
    test[key]=$scope.data[key];
    array.push(test);
}
$scope.data = array;

HTML

      {{key}} : {{value}}

Answer 5

Ein Todo-List-Beispiel, das über ein Objekt mit ng-repeat iteriert:

var app = angular.module('toDolistApp', []);
app.controller('toDoListCntrl', function() {
  var self = this;
  self.toDoListItems = {};// []; //dont use square brackets if keys are string rather than numbers.
  self.doListCounter = 0;

  self.addToDoList = function() {                  
    var newToDoItem = {};
    newToDoItem.title     = self.toDoEntry;
    newToDoItem.completed = false;         

    var keyIs = "key_" + self.doListCounter++;             

    self.toDoListItems[keyIs] = newToDoItem;           
    self.toDoEntry = ""; //after adding the item make the input box blank.
  };
});

app.filter('propsCounter', function() {
  return function(input) {
    return Object.keys(input).length;
  }
});

    Gesamtanzahl von Items: {{toDoListCntrlAs.toDoListItems | propsCounter}}
    Eintrag Todo-Item:  
    {{toDoListCntrlAs.toDoEntry}}
    Item hinzufügen 

      {{$index+1}} : {{key}}   : Titel = {{ prop.title}} : Status = {{ prop.completed}}