Dev Faq
0
votes

NGFOR ne fonctionne pas lors de l'abonnement au sujet d'un service

Dans une application angulaire 7, ma directive NGFF ne fonctionne pas et ne produit aucune erreur non plus. Voici comment l'application fonctionne

  1. Le composant appelle le service pendant l'oninit et en même temps souscrit au sujet du service.
  2. Au cours de cet appel, le service récupère certaines données et lorsque cela se fait, j'envoie une tranche de ces données au composant.
  3. Je peux voir les données dans le composant, mais le NGFR ne produit pas la sortie attendue. Cela ne produit rien fondamentalement, comme si les données ne sont jamais arrivées. Peux-tu aider s'il te plait?

    Le projet est ici .

1 commentaires

Au fait, votre logique de service est complexe. Vous pouvez trouver de meilleures façons.

3 Réponses :

4
votes

Vous devez changer votre Manchetection du composant vers Par défaut code > En supprimant simplement cette ligne ou en utilisant changeetectionstrategy.default code> à la place.

Onph Strategy désactive la détection automatique des changements. P> Si vous avez une raison d'utiliser ONPUSH code> Stratégie dans votre composant, vous devez alors déclencher manuellement la détection des modifications p>

pour le faire, vous devez injecter modifiéTectorRef code> dans votre composant: p> xxx pré>

et le déclencher après avoir chargé les données: P> 

getData.subscribe(images => {
  // do something
  this.cdr.detectChanges();
});

0 commentaires
1
votes

Ceci est parce que vous utilisez "Onpush" et ne pas déclencher la détection de changement lorsque vous recevez vos images.

Vous pouvez soit injecter le changeTectorRef et appeler markforcheck () dessus après l'attribution de vos images à this.images , mais mieux Vous ne devriez pas gérer vous-même vous-même et "déballer" vos observables:

  • Changer d'images en un observable
  • attribue directement l'observable renvoyé par le service à ce champ
  • Utilisez l'asyncpipe de votre modèle
0 commentaires
-1
votes

Avant le * NgFor Vous devez avoir une DIV et que la DIV doit avoir une condition * NGIF après avoir récupéré les données du service, alors le vrai VRAI Le * NGIF maintenant il devait essayer ceci.

1 commentaires

L'OP utilise onpush détection de changement. Il suffit de ajouter un div avec * ngif n'a aucun impact et n'est pas la bonne solution. S'il vous plaît regarder la Stackblitz partagé.

Articles qui pourrait vous intéresser :

Impossible d'importer le module "@ angular / material"
Erreur de compilation angulaire: NG6001: la classe est répertoriée dans les déclarations du NgModule 'AppModule', mais n'est pas une directive, un composant ou un tube
erreur NG6002: apparaît dans le NgModule.imports d'AppModule, mais n'a pas pu être résolu en une classe NgModule
[ng update]: Erreur - Le package "@ angular-devkit / schematics" ne peut pas être résolu à partir du répertoire racine de l'espace de travail