javascript date difference showing wrong in ios

December 8, 2022

I’m trying to add a timer using the function, but it’s working fine in windows, but showing the wrong timer in IOS.

enddate = "2023-04-25 00:00:00"; 

getEventTimer() {
    setInterval(() => {
      if(this._diff > 0) {
        this._days = this.getDays(this._diff);
        this._hours = this.getHours(this._diff);
        this._minutes = this.getMinutes(this._diff);
        this._seconds = this.getSeconds(this._diff);
      } else {
        this._days = 0;
        this._hours = 0;
        this._minutes = 0;
        this._seconds = 0;
      }
      
      const s:any = new Date(this.enddate.toLocaleString().replace(/-/g, "/"));
      const t:any = new Date(new Date().toLocaleString().replace(/-/g, "/"));
      this._diff = s - t;
    }, 1000);

  }

 getDays(t) {
    return Math.floor(t / (1000 * 60 * 60 * 24));
  }

  getHours(t) {
    return Math.floor((t / (1000 * 60 * 60)) % 24);
  }

  getMinutes(t) {
    return Math.floor((t / 1000 / 60) % 60);
  }

  getSeconds(t) {
    return Math.floor((t / 1000) % 60);
  }

………………………………………………………………………………………………………………….

expecting the correct timer.

>Solution :

It looks like the issue may be with the way you are formatting the date strings in the getEventTimer() function. In particular, the line const s:any = new Date(this.enddate.toLocaleString().replace(/-/g, "/")); replaces all instances of - with / in the date string, which may not work as expected on iOS devices.

To fix this issue, you can use the Intl.DateTimeFormat() method to format the date string in a way that is consistent across different devices and platforms. Here is an example of how you can use this method to format the enddate string:

const dateFormatter = new Intl.DateTimeFormat('en-US');
const enddateString = dateFormatter.format(new Date(this.enddate));
const s:any = new Date(enddateString);

You can also simplify the rest of the getEventTimer() function by using the setInterval() method to update the timer values automatically, without the need for separate functions to calculate the days, hours, minutes, and seconds. Here is an example of how you can do this:

setInterval(() => {
  const s:any = new Date(enddateString);
  const t:any = new Date();
  const diff = s - t;

  if(diff > 0) {
    this._days = Math.floor(diff / (1000 * 60 * 60 * 24));
    this._hours = Math.floor((diff / (1000 * 60 * 60)) % 24);
    this._minutes = Math.floor((diff / 1000 / 60) % 60);
    this._seconds = Math.floor((diff / 1000) % 60);
  } else {
    this._days = 0;
    this._hours = 0;
    this._minutes = 0;
    this._seconds = 0;
  }
}, 1000);

I hope this helps! Let me know if you have any other questions.