Erhalten API-Daten für jede Zeile in ng-repeat

Question

ich folgende Daten:

{ 
    "id": 1, 
    "price": 229.2, 
    "product": 263, 
    "plan": null, 
    "currency": 2, 
    "taxrule": 1 # ID of the Taxrule 
} 

Dies kann auch eine Liste von Objekten sein.

Wenn ich diese Daten veröffentliche, möchte ich auch die relevanten Daten für jede ID abrufen. Zum Beispiel möchte ich den Namen der Taxrule anzeigen. Deshalb möchte ich einen API-Aufruf machen und holen die Taxrule mit ID 1, die wie folgt aussehen:

{ 
    "id": 1, # ID of the Taxrule 
    "name": "25% Standard", 
    "percentage": 25.0 
} 

Wenn mein HTML wie folgt aussieht:

<tr class="clickable-row" ng-repeat="pricing in pricings"> 
    <td> 
     <span>{{pricing.price}}</span> 
    </td> 
    <td> 
     <span>{{pricing.taxrule.name}}</span> 
    </td> 
</tr> 

Wie zeige ich {{pricing.taxrule.name}}? Wie führe ich einen API-Aufruf zum Auffüllen der Daten innerhalb der Schleife?

Answer 1

Dies sollte wirklich von der API behandelt werden, die die Preisdaten zurückgibt, aber ich weiß, dass wir nicht immer die Kontrolle darüber haben, was wir zurückgeben.

Wenn es nicht viele Taxrules gibt, würde ich vorschlagen, Preise und Taxrules von der API in zwei Aufrufen zu bekommen. Dann in Ihrem HTML-Filtern Ihre taxrules in einer ng-repeat

<tr class="clickable-row" ng-repeat="pricing in pricings"> 
<td> 
    <span>{{pricing.price}}</span> 
</td> 
<td> 
    <span ng-repeat="taxrule in taxrules | filter:{id:pricing.taxrule}"> 
     {{taxrule.name}} 
    </span> 
</td>