Comment s'abonner à angularMaterial Dialogue afterClosed?

Concernant la fermeture d'une boîte de dialogue. https://material.angular.io/components/component/dialog afterClosed n'est pas thenable?

Que la documentation principale:

Comment s'abonner à angularMaterial Dialogue afterClosed?

Erreur

Property 'then' does not exist on type '() => Observable<any>'. [default] Checking finished with 1 errors

J'ai essayé de vous abonner, mais ne fonctionne pas non plus.

InformationsquelleAutor meshfields | 2017-02-20
  1. 22

    En fonction sur les exemples de la partie de leur la documentation

    let dialogRef = this.dialog.open(DialogResultExampleDialog);

dialogRef.afterClosed().subscribe(result => {
  this.selectedOption = result;
});

    Mais vous pouvez toujours convertir le résultat de la promesse, si nécessaire

    dialogRef.afterClosed().toPromise()

    Ne pas oublier d'ajouter toPromise soutien

    import "rxjs/add/operator/toPromise";
    • Nous sommes à la recherche, à la documentation? Dans ma version (je screenshotted il) je vois .then. À partir de laquelle les docs avez-vous le .subscribe ?
    • Oui, ouvrez examles onglet. Ici vous pouvez trouver exemple de travail
    • Merci! Bonus: Comment faire pour se désabonner dans ce cas, si l'utilisation de cet abonnement?
    • essayez ceci: let subscription = dialogRef.afterClosed().subscribe(); subscription.unsubscribe();
    • Si le désabonnement être appelé immédiatement ou onDestroy()?
    • Il ressemble dans ce cas, l'Observable est un "finite observables" (.next() est appelé sur elle, et .complete() juste après), nous ne devrions pas besoin de vous désinscrire, selon netbasal.com/when-to-unsubscribe-in-angular-d61c6b21bad3

    InformationsquelleAutor VadimB
  2. 16

    https://material.angular.io/components/component/dialog

    afterClosed méthode retourne un Observables de sorte qu'il n'est pas thenable comme Promesse objet.

    Pour éviter d'utiliser toPromise méthode sur la Observables vous pouvez utiliser (1) pour vous désabonner automatiquement après le premier événement:

    dialogRef.afterClosed().take(1).subscribe(result => {
  console.log(`Dialog result: ${result}`); //Pizza!
});
    • pas nécessaire de vous désabonner. alors qu'en interne une Subject<R> il termine immédiatement this._afterClosed.next(this._result); this._afterClosed.complete(); donc take(1) n'a rien d'utile - mais, en général, une bonne pratique et ne fait pas de mal si jamais vous n'êtes pas sûr!
    • En fonction de votre UI/UX design, il pourrait être possible que la boîte de dialogue demeure active tant que le composant sous-jacent a été commuté. Sans se désabonner après la composante 1 a disparu, la boîte de dialogue créée en composant peut continuer à exécuter le traitement lorsque le composant est maintenant en place. Vous peut ou peut ne pas vouloir un tel flux de travail. Si vous ne voulez pas, alors vous désabonner en ngOnDestroy de la composante 1.
    InformationsquelleAutor aecz
  3. 9

    Pas besoin de vous désinscrire de afterClosed() que l'auto complète lui-même:
    https://github.com/angular/material2/blob/ae41a0ad69ca26c600f0f56c68dd5a1c102d4f1f/src/lib/dialog/dialog-ref.ts#L75

    • 🙂 Il fonctionne parce qu'il n'cette this._afterClosed.next(this._result); this._afterClosed.complete();
    • CE doit être la accepté de répondre. @VladimirB la réponse est tout simplement pas correct.
    InformationsquelleAutor mustordont
  4. 1

    Vous pouvez également utiliser le (premier) RxJs opérateur au lieu de prendre(1). Pour mon avis personnel, c'est mieux (même si ils font la même chose).

    dialogRef.afterClosed().first().subscribe(result => {
console.log(`Dialog result: ${result}`);
});
    • (première) et(1) ne faites pas la même
    • Vous avez raison mon ami. Il est préférable de l'utiliser(1). Thumbs up
    InformationsquelleAutor Udi Mazor