Convert gregorian date to persian (jalali) date in angular 2 and Ionic 2

Question

I am familiar with one package located in npm for converting gregorian date to persian (jalali), but I do not know how to use it in ionic 2 angular 2 projects.

Jalali-date

or this package for angular 1:

ADM-dateTimePicker

Is it possible to convert this package to angular 2? Any ideas? or tutorial welcome ...

Answer 1

ok, I wrote a converter for this,

first add a provider to your project:

import {Injectable} from '@angular/core'; @Injectable() export class PersianCalendarService { weekDayNames: string[] = ["شنبه", "یکشنبه", "دوشنبه", "سه شنبه", "چهارشنبه", "پنج شنبه", "جمعه"]; monthNames: string[] = [ "فروردین", "اردیبهشت", "خرداد", "تیر", "مرداد", "شهریور", "مهر", "آبان", "آذر", "دی", "بهمن", "اسفند"]; strWeekDay: string = null; strMonth: string = null; day: number = null; month: number = null; year: number = null; ld: number = null; farsiDate: string = null; today: Date = new Date(); gregorianYear = null; gregorianMonth = null; gregorianDate = null; WeekDay = null; buf1: number[] = [0, 31, 59, 90, 120, 151, 181, 212, 243, 273, 304, 334]; buf2: number[] = [0, 31, 60, 91, 121, 152, 182, 213, 244, 274, 305, 335]; constructor() { } PersianCalendar(gregorianDate): string { this.today = gregorianDate; this.gregorianYear = this.today.getFullYear(); this.gregorianMonth = this.today.getMonth() + 1; this.gregorianDate = this.today.getDate(); this.WeekDay = this.today.getDay(); this.toPersian(gregorianDate); return this.strWeekDay + " " + this.day + " " + this.strMonth + " " + this.year; } toPersian(gregorianDate) { if ((this.gregorianYear % 4) != 0) this.farsiDate = this.func1(); else this.farsiDate = this.func2(); this.strMonth = this.monthNames[Math.floor(this.month - 1)]; this.strWeekDay = this.weekDayNames[this.WeekDay + 1]; } func1(): string { this.day = this.buf1[this.gregorianMonth - 1] + this.gregorianDate; if (this.day > 79) { this.day = this.day - 79; if (this.day <= 186) { var day2 = this.day; this.month = (day2 / 31) + 1; this.day = (day2 % 31); if (day2 % 31 == 0) { this.month--; this.day = 31; } this.year = this.gregorianYear - 621; } else { var day2 = this.day - 186; this.month = (day2 / 30) + 7; this.day = (day2 % 30); if (day2 % 30 == 0) { this.month = (day2 / 30) + 6; this.day = 30; } this.year = this.gregorianYear - 621; } } else { this.ld = this.gregorianYear > 1996 && this.gregorianYear % 4 == 1 ? 11 : 10; var day2 = this.day + this.ld; this.month = (day2 / 30) + 10; this.day = (day2 % 30); if (day2 % 30 == 0) { this.month--; this.day = 30; } this.year = this.gregorianYear - 622; } var fullDate = this.day + "/" + Math.floor(this.month) + "/" + this.year; return fullDate } func2(): string { //console.log("entered func2"); this.day = this.buf2[this.gregorianMonth - 1] + this.gregorianDate; this.ld = this.gregorianYear >= 1996 ? 79 : 80; if (this.day > this.ld) { this.day = this.day - this.ld; if (this.day <= 186) { var day2 = this.day; this.month = (day2 / 31) + 1; this.day = (day2 % 31); if (day2 % 31 == 0) { this.month--; this.day = 31; } this.year = this.gregorianYear - 621; } else { var day2 = this.day - 186; this.month = (day2 / 30) + 7; this.day = (day2 % 30); if (day2 % 30 == 0) { this.month--; this.day = 30; } this.year = this.gregorianYear - 621; } var fullDate = this.day + "/" + Math.floor(this.month) + "/" + this.year; return fullDate } else { var day2 = this.day + 10; this.month = (day2 / 30) + 10; this.day = (day2 % 30); if (day2 % 30 == 0) { this.month--; this.day = 30; } this.year = this.gregorianYear - 622; } } } 

next step: import this service into your code:

 import {PersianCalendarService} from '../../providers/persian-calendar-service/persian-calendar-service'; 

next step: implement the provider name in the @Page section

 @Page({ templateUrl: 'build/pages/getting-started/getting-started.html', providers: [PersianCalendarService] }) 

and in the constructor

 constructor( public persianCalendarService: PersianCalendarService) {} 

then you just need to pass the date of the function to get a good Jalali date result:

  getJalaliDate(date) { var date1 = this.persianCalendarService.PersianCalendar(date); this.farsiDate = date1; 

}

I will add this code to github soon. Thanks

Answer 2

Use the jalali-moment module as the following code

 import * as moment from 'jalali-moment'; let jalaliDate = moment('1989/1/24').locale('fa').format('YYYY/M/D'); // 1367/11/4 

demo in plunker

Answer 3

You can do this with the difference in milliseconds between the Jalali calendar and the Gregorian, here is my solution:

 var g_date = new Date("2018-04-04 00:00:00"); // example Gregorian date g_date_in_milliseconds = date.getTime(); // Gregorian date in milliseconds const difference = 1.9603638 * Math.pow(10, 13); // difference of Jalali calendar and Gregoria j_date_in_milliseconds = g_date_in_milliseconds - difference; // converted to Jalali milliseconds j_date = new Date(j_date_in_milliseconds); // converted to date object 

And you can easily convert Jalali to Gregorian as follows:

 g_date_in_milliseconds = j_date_in_milliseconds + difference; g_date = new Date(g_date_in_milliseconds); 

Answer 4

Simple: new date (2019,2,21) .toLocaleDateString ('fa-Ir'); // output => ۱۳۹۸/۱/۱