why is my time/date picker formatting adding minutes?

Question

I have both a time picker and a date picker in my template. The values store to my database together as one numeric string, so I have to do a few steps to parse them from one another in the right formats when I interpolate them to my template in the required places on a different page. First I call a formatting function to separate the values and then I run it through an angular-moment pipe to convert the military time to standard 12 hour time.

I noticed that consistently when I pick a time, say 7:00 or 12:00 on the time picker, it will interpolate to my template as 7:08 or 12:08. Why is it adding minutes?

THIS IS HOW I SAVE THE DATE AND TIME TO THE DATABASE

constructor(//controllers n stuff) {

//empty event object

      this.event = {
        hostName : "",
        hostId: "",
        hostPhoto : "",
        coverCharge: 0,
        drinkMin: false,
        reimburse: false,
        venue : "",
        guests : 0,
        date : "", 
        time : "",
        city : "",
        eventTime : "",
        createdTime: "",
        volunteers : 0 

      } 
}//close constructor 

addEvent(){

    let authData = OnymosAccess.getAuth(); //GET DATABASE AUTH
            this.event.hostName = authData.userName;
            this.event.hostId = authData.userId; 
            this.event.hostPhoto = authData.userPhoto();
          **this.event.eventTime = new Date(this.event.date + " " + this.event.time).getTime();**
            this.event.createdTime = Date.now();

            let that = this;

                OnymosUtil.addData( //SEND TO DATABASE

        '/events/' + this.event.city + '/' + this.event.createdTime,
                        this.event,

        function optionalSuccessCallback (statusMessage) {
                            console.log(statusMessage);

                            that.saveStatus = "successfully saved";
                         },

            function optionalFailureCallback (error) {

                            that.saveStatus = "failed saving" + error;
                        });
}//end addEvent

HTML TEMPLATE

<ion-row>
                <ion-col>
                    <ion-icon name="calendar"></ion-icon>
                    <BR>
                    **{{getFormattedTime(event.eventTime, 'MM-dd-yyyy')}}** 
                </ion-col>
                <ion-col>
                    <ion-icon name="clock"></ion-icon>
                    <BR> 
                    **{{ getFormattedTime(event.eventTime,'HH:MM' ) | amParse:'HH:mm' | amDateFormat:'hh:mm A' }}**

                </ion-col>

THE GET FORMATTED TIME FUNCTION I RUN THE TIME THROUGH BEFORE I USE MOMENT.

getFormattedTime (time, format) {
        var t = new Date(time);
        var tf = function (i) { return (i < 10 ? '0' : '') + i };
        return format.replace(/yyyy|MM|dd|HH|mm|ss/g, function (a) {
            switch (a) {
                case 'yyyy':
                    return tf(t.getFullYear());

                case 'MM':
                    return tf(t.getMonth() + 1);

                case 'mm':
                    return tf(t.getMinutes());

                case 'dd':
                    return tf(t.getDate());

                case 'HH':
                    return tf(t.getHours());

                case 'ss':
                    return tf(t.getSeconds());

            }
        })
    } // end of getFormattedTime

Answer 1

<ion-col>
     <ion-icon name="calendar"></ion-icon>
     <BR>
     **{{getFormattedTime(event.eventTime, 'MM-dd-yyyy')}}** 
</ion-col>
<ion-col>
     <ion-icon name="clock"></ion-icon>
     <BR> 
     **{{ getFormattedTime(event.eventTime,'HH:mm' ) | amParse:'HH:mm' | amDateFormat:'hh:mm A' }}**
</ion-col>

You have to use getFormattedTime(event.eventTime,'HH:mm' ). In your code you are using getFormattedTime(event.eventTime,'HH:MM' ) MM will return month

MM- Months, mm -Minutes