Ionic 4: iOS not showing time values

Ionic Framework
1

Hi,

I am working on an ERP system using Ionic 4.

Version Info:

Ionic:

   ionic (Ionic CLI)             : 4.10.3 (C:\Users\BasVoss\AppData\Roaming\npm\node_modules\ionic)
   Ionic Framework               : @ionic/angular 4.0.2
   @angular-devkit/build-angular : 0.12.4
   @angular-devkit/schematics    : 7.2.4
   @angular/cli                  : 7.2.4
   @ionic/angular-toolkit        : 1.4.0

Cordova:

   cordova (Cordova CLI) : not installed
   Cordova Platforms     : android 7.1.4, ios 4.5.5
   Cordova Plugins       : not available

System:

   NodeJS : v10.15.1 (C:\Program Files\nodejs\node.exe)
   npm    : 6.4.1
   OS     : Windows 10

in the hours overview page there are dates, timestamps, etc. Everything shows fine on android. iOS has 1 issue. i can’t see any timestamps. Its not an API problem cuz i see the other data fine.
the original time value from the API is a string like “08:30” which i first turn into a datetime value and then turn into a time value.

i change the time values seperate. so i make them for iOS and android seperate.

                    var currentDate = moment().format('YYYY-MM-DD');
                    
                    //turn start_time and end_time into datetime's
                    let startDate = currentDate + " " + data[i]['start_time'];
                    let endDate = currentDate + " " + data[i]['end_time'];
            
                    if (this.platform.is('ios')) {
                        
                        //get time out of the new data
                        let startNewTime = moment(startDate).format('THH:mm');
                        let endNewTime = moment(endDate).format('HH:mm');  //both of these are not working
                    
                        //make startNewTime the new start_time data types
                        data[i]['start_time'] = startNewTime;
                        data[i]['end_time'] = endNewTime;
            
                        //push new data into this.table
                        this.table.push(data[i]);
                       
                        } else {
                        //get time out of the new data
                        let startNewTime = moment(startDate).format('HH:mm');
                        let endNewTime = moment(endDate).format('HH:mm'); // both of these work on android
                    
                        //make startNewTime the new start_time data types
                        data[i]['start_time'] = startNewTime;
                        data[i]['end_time'] = endNewTime;
                        console.log(data[i]['start_time']);
                        //push new data into this.table
                        this.table.push(data[i]);
                    }


// used HTML
<ion-datetime displayFormat="HH:mm" [value]="filteredItems[(config.itemsPerPage * (config.currentPage - 1)) + i].end_time" readonly></ion-datetime>

// tried throwing it into an empty html div
              <div>
                    {{filteredItems[(config.itemsPerPage * (config.currentPage - 1)) + i].end_time | date: 'HH:mm'}}
                </div>

// again this works for android, but not iOS

i tried using regular date and then converting it to an ISOString in an ion-datetime. This stopped the entire page from working on iOS.

besides moment i have tried using date-fns. no luck there either. still an empty output. I can’t debug on iOS since i am using a windows device.

as far as i know, i am out of options and can’t find any help on other forums.

i’d really appreciate the help.

~ b3nvo

2

Fixed this after looking for the correct safari string.

datestring.replace(/ /g, "T");