2017-02-09 15 views
5

Mam następujący kod Ionic fragment do wyświetlania alarmów/błędy w przemysłowym aplikacji:Ionic: Jak nie umieszczać wielu powiadomień o toastach?

showError(message: string) { 
    let toast = this.toastController.create({ 
     message: message, 
     position: 'top', 
     duration: 5000, 
     cssClass: 'danger', 
     showCloseButton: true 
    }); 
    toast.present(); 
} 

App powoduje komunikat o błędzie przy każdym wykryciu problemów z połączeniem, które będą również w przybliżeniu na 5 sekund timera .

Wiele wywołań tej metody spowoduje, że 2 lub więcej komunikatów o błędach pojawi się jeden na drugim, jeśli czas tego kodu zostanie zmieniony. Czy mogę jakoś wykryć, że toast jest już wyświetlany? Poza tym licznik czasu 5000 ms nie byłby konieczny i mogę ponownie usunąć komunikat o błędzie, gdy połączenie zostanie przywrócone.

Dzięki i BR Florian

Odpowiedz

4

Można przechowywać obiekt toast zmiennej poza funkcją, i wywołać odwołania() metoda przed pokazaniem następnego tosty:

import { ToastController, Toast } from 'ionic-angular'; 


toast: Toast;  

showError(message: string) { 
    try { 
     this.toast.dismiss(); 
    } catch(e) {} 

    this.toast = this.toastController.create({ 
     message: message, 
     position: 'top', 
     duration: 5000, 
     cssClass: 'danger', 
     showCloseButton: true 
    }); 
    toast.present(); 
} 
+0

Uh tak masz rację ... czasami jest zbyt oczywiste, aby zobaczyć lol. Spróbuję tego ... – flohack

+0

:) Czy możesz oznaczyć odpowiedź jako zaakceptowaną, jeśli rozwiązała twój problem? –

+1

Dziękuję, zgadzam się z flohack, zbyt oczywiste, aby znaleźć. – wmehanna

1

Oto moje rozwiązanie: -)

// ToastService.ts 
import { Injectable } from '@angular/core'; 
import { ToastController, Toast } from 'ionic-angular'; 

@Injectable() 
export class ToastService { 

    private toasts: Toast[] = []; 

    constructor(private toastCtrl: ToastController) {} 

    push(msg) { 
    let toast = this.toastCtrl.create({ 
     message: msg, 
     duration: 1500, 
     position: 'bottom' 
    }); 

    toast.onDidDismiss(() => { 
     this.toasts.shift() 
     if (this.toasts.length > 0) { 
     this.show() 
     } 
    }) 

    this.toasts.push(toast) 

    if (this.toasts.length === 1) { 
     this.show() 
    } 
    } 

    show() { 
    this.toasts[0].present(); 
    } 

}