J'ai un modèle qui ressemble à ceci.
contact = {
lastNames: 'Garcia Smith',
firstNames: 'Gabriel',
mutualFriends: [
{
lastNames: 'Llull',
firstNames: 'Ramon',
mutualFriends[],
},
{
lastNames: 'Pereira dos Santos',
firstNames: 'JoÄo Maria',
mutualFriends: [],
}
],
};
et selon la façon dont je modifie l'abonnement à une observable dépend de la météo ou non, je peux voir l'objet du sous-tableau d'un tableau. Dans cet exemple, c.mutualFriends [nom] est un sous-tableau contenant des informations supplémentaires. mutualFriends est un tableau d'objets (un exemple est ci-dessous).
maintenant dans le composant que je faisais précédemment:
this.contactList$ = this.contactService.getContacts();
note latérale: je sais qu'avec cette façon, vous devez modifier le modèle ci-dessus afin de ne pas avoir d'erreurs. dans ce cas, supprimez le
Lors de l'obtention des valeurs de cette façon, le tableau de chaînes dans c.mutualFriends [lastNames] code> sera répertorié. après s'être abonné à l'observable de cette façon:
this.contactService.getContacts().subscribe((users: Contact[]): void => {
this.contactList = users;
});
à l'intérieur du modèle c.mutualFriends [lastNames] rien n'est répertorié.
Comment puis-je effectuer le rendu à partir de l'exemple ci-dessous:
<ng-container *ngIf="contactList$ | async as contactList">
<ion-virtual-scroll [items]="contactList">
<ion-item *virtualItem="let c" (click)="openProfile(c)">
<ion-thumbnail slot="start">
<img [src]="c.profilePicture" />
</ion-thumbnail>
<ion-label position="stacked">{{ c.lastNames }}, {{ c.firstNames }}</ion-label>
<ion-label position="stacked">{{ c.mutualFriends[lastNames] }}</ion-label>
</ion-item>
</ion-virtual-scroll>
</ng-container>
dans mon modèle, je veux voir 'Llull, Pereira dos Santos' comme je le pourrais avec la première façon de souscrire.
J'espère que c'était assez détaillé. merci pour votre aide!
4 Réponses :
mutualFriend est un tableau, vous devez donc accéder aux éléments en utilisant index et non avec une chaîne.
Essayez d'utiliser:
c.mutualFriends [index] .lastNames
où index est l'index des boucles ou utilise des valeurs statiques comme 0,1 ...
Ou vous devez exécuter une boucle sur des amis communs pour accéder à tous les éléments d'amis communs.
Vous devez appeler la méthode subscribe () . Comme la méthode subscribe () est utilisée pour activer l'observable et écouter les valeurs émises par observable.
this.contactList$ = this.contactService.getContacts()
.pipe(
map((res) => {
this.contactList = res.json();
})
);
De plus, vous avez le choix d'utiliser pipe ( ) opérateur. L'opérateur pipe () est utilisé pour chaîner les opérateurs observables
this.contactList$ = this.contactService.getContacts()
.subscribe((users: Contact[]) => {
this.contactList = users;
});
Merci pour la contribution. Je pensais que je pourrais le faire de la manière la plus simple car il n'y a que moins de lignes, mais parfois, il est impossible de le contourner. Merci!
Essayez ngFor de parcourir le tableau
<ng-container *ngIf="contactList$ | async as contactList">
<ion-virtual-scroll [items]="contactList">
<ion-item *virtualItem="let c" (click)="openProfile(c)">
<ion-thumbnail slot="start">
<img [src]="c.profilePicture" />
</ion-thumbnail>
<ion-label position="stacked">{{ c.lastNames }}, {{ c.firstNames }}</ion-label>
<ion-label position="stacked" *ngFor="let mutualFriend of c.mutualFriends">{{ mutualFriend.lastNames }}</ion-label>
</ion-item>
</ion-virtual-scroll>
</ng-container>
Vous devez parcourir le tableau et afficher les landaus que vous voulez
merci cela fonctionne, je pensais pouvoir faire quelque chose comme ça, mais j'espérais contourner une autre boucle pour à l'intérieur une boucle rend la lecture plus difficile.
Vous devez extraire les valeurs 'lastNames' du tableau d'objets 'mutualFriends' pour plus de détails,
À partir d'un tableau d'objets , extraire la valeur d'une propriété sous forme de tableau
Les autres informations sont-elles affichées? Ex: est-ce que
c.profilePictureproduit quelque chose? Si vous essayez d'afficher la réponse entière sous la forme{{contactList | json}}ou{{c | json}}, obtenez-vous quelque chose ou un objet vide?oui tout le reste des informations est affiché