Help using LocalNotifications

Ionic Framework ionic-v3
1

Hello people, i need help with local notifications!

I want to allow users to pick an hour from DateTime picker and then, save a reminder that will fire when the time is the indicated by user.

I have this to allow users, pick an hour:
<ion-datetime pickerFormat="HH:mm" [(ngModel)]="time" cancelText="Cancelar" doneText="Aceptar"></ion-datetime>

<button ion-button block round (click)="saveReminder()">Guardar</button>

Actually, in saveReminder() i have:

public saveReminder(): void {

        if (this.timePicked()) {

            LocalNotifications.schedule({
                id: 1,
                text: '¡Hora de meditar!',
                at: new Date(new Date().getTime() + 5),
                sound: 'file://audio/sound.mp3',
                every: "day",
                //data: { message : 'Informacion' },
                //icon: 'res://icon',
                //smallIcon: 'res://ic_popup_sync'
            });

            this.showSavedReminderMsg();
        } else {
            this.showNoTimePickedError();
        }

    }

saveReminder() schedule a local notification that will appear 5 seconds after user press button (it’s only for test)
Now, i need to know how to schedule this notification with the date picked by the user.

My date picker, returns a string like: “08:45” and i need if exist any way to get separated hours and minutes to pass them to scheduler, or how to achieve this in some other way.

Here is the official ionic doc that explain with Date.now():

But it does not apply to my case.

Thank’s so much in advance!

Ivan.

2

Anyone know how to get the hour and minute separately?
I have this:

<ion-datetime
    PickerFormat = "HH:mm"
    [(NgModel)] = "time"
    CancelText = "Cancel"
    DoneText = "OK">
</ion-datetime>

Which saves a string in my variable time when selecting a schedule. I need to get hours and minutes apart. Instead of saving a string, can I get a Date object or something like that?

Because in stack overflow, an user say me that i can use

LocalNotifications.schedule({
   text: 'Delayed ILocalNotification',
   at: new Date(year, month, day, hours, minutes, seconds, milliseconds),
   led: 'FF0000',
   sound: null
});
3

Solved it.

public saveReminder(): void {

        if (this.timePicked()) {

            var scheduleDate = new Date(this.actualDate() + ' ' + this.time);

            LocalNotifications.schedule({
                id: 1,
                text: '¡Hora de meditar!',
                //at: new Date(new Date().getTime() + 5),
                at: scheduleDate,
                sound: 'file://audio/sound.mp3',
                every: "day",
                //data: { message : 'Informacion' },
                //icon: 'res://icon',
                //smallIcon: 'res://ic_popup_sync'
            });

            this.showSavedReminderMsg();
        } else {
            this.showNoTimePickedError();
        }

    }


public actualDate(): string {

        let dd: any = this.date.getDate();
        let mm: any = this.date.getMonth() + 1; //January is 0!
        let yyyy: any = this.date.getFullYear();


        if (mm < 10) {
            mm = '0' + mm;
        }
        if (dd < 10) {
            dd = '0' + dd;
        }

        return yyyy +  '-' + mm + '-' + dd;
    }
2 Likes
4

This seems like an awful lot of work.

<ion-datetime pickerFormat="HH:mm" [(ngModel)]="time"
                cancelText="Cancelar" doneText="Aceptar"></ion-datetime>
<button ion-button (click)="saveReminder()">save reminder</button>

import * as moment from "moment";
time:string = moment().toISOString();
saveReminder(): void {
  let scheduleDate = moment(this.time).toDate();
  // all ready to go
}

You could probably do the whole thing with JavaScript Date objects instead of using Moment, but I love Moment and detest JavaScript’s built-in date handling, so I just pretend it doesn’t exist. In any event, I think the key is priming the datetime picker’s bound property to a valid ISO8601 string at the start; then you should not have any need to fool around with all of that actualDate stuff.

2 Likes
5

That looks much better. Thank you very much for your explanation!

6

Thanks a lot its working for me .

1 Like