J'essaye d'ajouter la classe «active» à l'élément qui a été sélectionné dans la liste. Le problème est que lorsque j'essaie d'obtenir le composant parent du formulaire de données, la classe «active» n'est pas appliquée. Je suppose que c'est plus clair ici -> https://stackblitz.com/edit/angular-ivy-okkrbd?file=src/app/child/child.component.html

Je pense que cela peut être quelque chose avec un modèle rafraîchissant (?). À ce stade, je ne sais pas trop quoi faire. J'ai essayé de nombreuses réflexions, mais rien n'a aidé.

0
Rotten_Banana 17 août 2020 à 11:29

2 réponses

Meilleure réponse

La propriété includes ne semble pas fonctionner pour les objets. Je vous suggère d'utiliser some à la place. Comme ça

ts

tesCar(car){
  return this.selectedCarList.some(object => object.id == car.id && object.title == car.title)
}

html

[ngClass]="{'active': testCar(car)}"

De cette façon, cela devrait fonctionner

MODIFIER:

Si vous avez un objet plus grand et que l'objet entier doit être égal, vous pouvez l'utiliser pour vérifier si les valeurs sont bonnes

this.selectedCarList.some(object => Object.values(object).every(item => Object.values(car).includes(item)))

Cela itérera sur chaque valeur de l'objet trouvé sur selectedCarList et vérifiera si la valeur est incluse dans les valeurs de votre voiture. C'est mieux si vous avez un gros objet car vous n'aurez pas à écrire manuellement object.id && object.title && ...

1
Alexis 17 août 2020 à 08:54

Vous devrez changer la méthode ngOnChanges comme ceci:

ngOnChanges() {
   this.selectedCarList = [];    
   if (this.dataToChild)
   {
      this.dataToChild.forEach(e => { 
         var wantedItem =this.carList.find(x => x.id === e.id);
         if (wantedItem)
             this.selectedCarList.push(wantedItem);
       })    
   }
 }

Le problème est que les éléments que vous ajoutiez dans this.selectedCarList.push sont des objets différents de ceux de votre liste carList. Ils ont un hash différent et c'est pourquoi votre filtre selectedCarList.includes(car) a toujours échoué.

2
D A 17 août 2020 à 08:55