V Ionic (ver.5) aplikácii je vhodné pridať funkcionalitu zobrazovania tzv.toast-u (ti.krátkodobo zobrazenej informácie o tom, že sa vykonala/vykonáva nejaká akcia).
Pre toto si v aplikácii vytvorím samostatný servis "alert", príkazom:
ionic generate service services/alertvo vytvorenom súbore "alert.service.ts" doplniť kód:
import { Injectable } from '@angular/core';import { ToastController } from '@ionic/angular';@Injectable({ providedIn: 'root'})export class AlertService { constructor( private toastController: ToastController ) { } // zobrazenie toast informacnyho alert-u: async presentToast(message: any) { const toast = await this.toastController.create({ message: message, duration: 2000, position: 'bottom', color: 'success' }); toast.present(); }}Úlohou tohto servisu bude zobraziť "toast" s požadovaným textom/informáciou.
A teraz na stránke, kde vykonávam nejakú operáciu a chcem tam zobraziť tento toast/alert, napr.v súbore "mytags.page.ts" doplniť takýto kód:
import { Component, OnInit } from '@angular/core';import { ApiService } from '../../services/api.service';import { NavController } from '@ionic/angular';import { AlertService } from '../../services/alert.service';@Component({ selector: 'app-mytags', templateUrl: './mytags.page.html', styleUrls: ['./mytags.page.scss'],})export class MytagsPage implements OnInit { pageContent = null; constructor( private api: ApiService, private navCtrl: NavController, private alertService: AlertService ) { } ... ngOnInit() { // ToDo: ID prihlaseneho user-a: const loggedUserID = 3; this.api.getUserTags(loggedUserID).subscribe((response) => { console.log(response); this.pageContent = response; }); } // naspat na predchadzajucu stranku: previousPage() { this.navCtrl.back(); } // zmaze vybraty tag: deleteTag(TagID) { // ToDo: ID prihlaseneho user-a: const loggedUserID = 3; this.api.deleteTag(TagID).subscribe((response) => { console.log('tag ID: '+TagID); this.pageContent = response; console.log(response); this.alertService.presentToast('tag (ID: '+TagID+') successfully deleted'); // a znovu nacitaj/refreshni stranku: this.ngOnInit(); }); }}tj.je tu pridaná referencia na tento servis, a pri vykonávaní funkcie "deleteTag()" sa volá zobrazenie toast-u (alertu) v ktorom bude informácia (že sa tag s daným ID úspešne vymazal).
...
Top comments(0)
For further actions, you may consider blocking this person and/orreporting abuse
