AngularJS dynamische Vorlage erstellen

Question

Ich versuche gerade, eine Art dynamische Vorlage zu erstellen, die Daten und Metainformationen von zwei separaten Diensten abruft. Das Endergebnis sollte eine Tabelle sein, die die Daten mit den korrekten Etiketten zeigt. Mein Plan war es, HTML -Templates mit verschiedenen grundlegenden Designs wie eine Tabelle mit 3,4 oder 5 Spalten zu erstellen. Dann sollte ein passender Controller die Metadaten von einem Dienst abrufen, der ein Array mit dem id eines Attributs und seinem name, das in der Tabelle angezeigt werden sollte, zurückgeben sollte. So weit so gut, aber jetzt kommt der knifflige Teil:
Der zweite Dienst holt die übereinstimmenden Daten für die Vorlage und die id der Metadaten und die id der tatsächlichen Daten übereinstimmt, damit Sie sie richtig abgleichen können.

Hier ist der Code auf plunkr: Link

Das Hauptproblem ist das folgende Stück Code:

<tr ng-repeat="person in persons"> 
    <td>{{person.name}}</td> 
    <td>{{person.age}}</td> 
    <td>{{person.postal}}</td> 
</tr> 

Zwischen den <td> -Tags hat nicht die abgerufenen Daten dynamisch erhalten, aber statisch. Ich möchte nicht explizit sagen, wie meine Attribute aufgerufen werden, sondern die abgerufenen Daten aus dem Meta-Service verwenden, um zu wissen, wie meine Attribute aufgerufen werden. Also sollte die Vorlage am Ende die Namen der Attribute sowie die passenden Daten erhalten. Habt ihr eine gute Idee, wie ich das lösen kann?

EDIT
Um ein wenig mehr klar zu machen Dinge:
Im Moment sind die Daten zwischen den <td> Tags geholt statisch, weil der Begriff {{person.name}} dort codierte Fest steht. Nehmen wir an, dass die Struktur der Daten sich ändert und es wird ein country -Attribut statt postal geben. Die Vorlage, die gleich bleibt, versucht weiterhin Daten von person.postal und nicht von person.country zu erhalten. Also undefined oder sogar ein Fehler wäre die Folge.
Um dies zu verhindern, sollten die Namen der Attribute von einem Meta-Service abgerufen und auf der Seite HTML erstellt werden.

Der Workflow sollte aussehen irgendwie so:

1. die Metadaten holen -> erhalten die Namen der Attribute
2. die Namen der Attribute in der ‚HTML‘ Stellen Sie die richtige Attribut zu nennen
3. holen die tatsächlichen Daten mit den vorher definierten Attribute
4. die Tabelle erstellen

Answer 1

http://jsfiddle.net/Lt024p9h/1/

<div ng-controller="MyCtrl"> 
    <table border="1"> 
    <tr ng-repeat="person in persons"> 
     <td ng-repeat="attr in query.attribs"> 
     {{person[attr.id]}} 
     </td> 
    </tr> 
    </table> 
</div> 

Richtig also, was ist hier los?

Also gehen Sie mit Ihrer Geige, was wir tun, wenn Sie die Attribute, die Sie anzeigen möchten, dann verwenden Sie das Objekt als associative array.

Dies erfordert, dass die attr.id und die Eigenschaften übereinstimmen.