Discussion :

[olivier252]

Hello,

Nouveau cas de figure aujourd'hui ! comme dit dans le titre je veux envoyer une data d'enfant à parent. sur le coup, je suis parti sur un @Output. Le soucis c'est que le compo enfant est un élément routé représenté donc par
<router-outlet></router-outlet> dans le compo parent

En googlant quelques minutes, je m'aperçoiqsque apparament, on ne peut pas faire un truc du genre :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<router-outlet (monEvent)="faisUnTruc()"></router-outlet>

Du coup, je pars sur un subject...Erreur là encore, car la variable que je veux faire passer (un boolean) de l'enfant au parent conditionne le rendu de la vue parent. Du coup, je modifie la vue de mon parent après la détection de changement et ça fout le bazard, plus précisement, ça génère ceci : ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked....Bref, je m'en sors pas

Bon un peu de mauvais code à présent :

le ts compo enfant, je souhaite récupérer la variable "isTest" :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
@Output testEvent: EventEmitter<boolean> = new EvenEmitter<boolean>();
 
ngOnInit(): void {
    this.itemsMenu = this.rayonService.itemsMenu;
    this.activatedRoute.paramMap.subscribe(params => {
      let paramUrlZone = params.get('id');
 
      if (paramUrlZone !== null) {
        this.isTest = true; // comment passer au parent ?
        this.testEvent.emit(this.isTest);
      }
    });
    this.initRefForm();
  }

Le html

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<router-outlet (testEvent)="faisUnTruc($event)"></router-outlet>

Bon merci, désolé pour la question galère

[krakatoa]

laisse tomber cette histoire de outlet, ce n'est pas une bonne voie.

la communication par service et la meilleure dans tous les cas.


si tu as ce message : ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked.

il faut utiliser le detectChange

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
    constructor(private cd: ChangeDetectorRef) { }
    ...
    ...
    this.cd.detectChanges();     // indique au framework d'effectuer le changement de detection car une nouvelle valeur ou nouvelle modification est arrivé !
    ...

ce message arrive car tu remontes une information
dans le composant il a une valeur qui est initialisé
l'abonnement te fais modifier cette valeur
le framework ne sait pas quelle est la valeur correcte, celle qui etait initialisé ou celel que tu as reçu par l'abonnement
il ne prend pas de décision et t'en informe.

plus que lancer le detectChange pour forcer le choix

[olivier252]

Merci, encore un point un peu obscur pour moi que le change detection d'angular.
D'habitude j'utilisais des subjects mais qui n'impactaient pas la vue parent...
Il me semblait bien que j'avais tout faux, et qu'il faut utiliser le ChangeDectorRef(). Bon je mets en résolu, merki !