En fait, je veux afficher this data dans un tableau. Ici, les données étaient {object object}. Je veux afficher toutes les valeurs de "dernier", "acheter" & "vendre" de toutes les devises. Je peux faire du code dur, mais je veux réduire les lignes de code en utilisant ng-repeat ou ngFor. Comment écrire les conditions pour cela?Comment afficher {objet objet} dans une table?
J'utilise angulaire 4.
Merci pour les gars de réponses, vos moyens travaillaient bien. Mais je l'ai trouvé plus facile façon de le faire:
function generateArray(obj) {
return Object.keys(obj).map((key) => obj[key]);
}
ce convertira l'objet JSON tableau et
<tr *ngFor="let post of posts">
<td>{{post.last}}</td>
<td>{{post.buy}}</td>
<td>{{post.sell}}</td>
</tr>
ce itérera JSON dans une table. P.S: J'ai sauvegardé le json dans des "posts" appelés "obj" de "posts".
Vous devez créer un tuyau et vous pouvez itérer objet.
@Pipe({ name: 'ObjNgFor', pure: false })
export class ObjNgFor implements PipeTransform {
transform(value: any, args: any[] = null): any {
return Object.keys(value)//.map(key => value[key]);
}
}
Ce plnkr pourrait vous aider.
Je n'utiliserais pas pure: false. De cette façon, après chaque changement de valeur, le tuyau est à nouveau exécuté. – Christian
ngFor travaille sur iterables, donc dans votre cas, vous devez d'abord transformer les données JSON dans un tableau.
let blockChainData:any = { ... } //data.retrieved.from.server;
let blockChainDataArray:Array<any> = [];
let dataKeys:Array<string> = Object.keys(blockChainData);
dataKeys.forEach((key:string) => {
let entry:any = blockChainData[key]; // Retrieve the object associated with the currency
entry.originalCurrency = key; // Preserve the original currency
blockChainDataArray.push(entry);
});
Dans votre code html, itérer sur le tableau
<td *ngFor="let entry of blockChainDataArray">{{ entry.originalCurrency }} {{ entry.buy }} {{ entry.sell }} {{ entry.last }} </td>
Quel code avez-vous essayé? – wmorrell
en fait, je n'ai aucune idée de itérer dans ce cas. Parce que, objet à l'intérieur d'un objet. Si c'était un tableau, je peux utiliser ngFor. – RuD3B0y
vous pouvez essayer de convertir cet objet en un tableau, puis itérer avec * ngPour –