use pipe for exchange english number to persian

src/app/calendar-nav/calendar-nav.component.html

@@ -9,7 +9,7 @@
             [hidden]="!isLabelClickable"
             [attr.data-hidden]="!isLabelClickable"
             (click)="labelClicked()"
-            [innerText]="label">
+            [innerText]="label | pNumber">
     </button>
   </div>
 

src/app/date-picker.module.ts

@@ -17,6 +17,9 @@ export {DayTimeCalendarComponent} from './day-time-calendar/day-time-calendar.co
 export {TimeSelectComponent} from './time-select/time-select.component';
 export {MonthCalendarComponent} from './month-calendar/month-calendar.component';
 
+import { ENumberPipe } from './e-number.pipe';
+import { PNumberPipe } from './p-number.pipe';
+
 @NgModule({
   providers: [
     DomHelper,
@@ -29,7 +32,9 @@ export {MonthCalendarComponent} from './month-calendar/month-calendar.component'
     MonthCalendarComponent,
     CalendarNavComponent,
     TimeSelectComponent,
-    DayTimeCalendarComponent
+    DayTimeCalendarComponent,
+    PNumberPipe,
+    ENumberPipe
   ],
   entryComponents: [
     DatePickerComponent

src/app/date-picker/date-picker.component.html

@@ -5,7 +5,7 @@
     <input type="text"
            class="dp-picker-input"
            [placeholder]="placeholder"
-           [ngModel]="inputElementValue"
+           [ngModel]="inputElementValue | pNumber"
            (ngModelChange)="onViewDateChange($event)"
            (focus)="inputFocused()"
            [readonly]="componentConfig.disableKeypress"

src/app/day-calendar/day-calendar.component.html

@@ -31,7 +31,7 @@
               (click)="dayClicked(day)"
               [disabled]="day.disabled"
               [ngClass]="getDayBtnCssClass(day)"
-              [innerText]="getDayBtnText(day)">
+              [innerText]="getDayBtnText(day) | pNumber">
       </button>
     </div>
   </div>

src/app/e-number.pipe.ts

@@ -0,0 +1,17 @@
+import { Pipe, PipeTransform } from '@angular/core';
+import { Persian } from './persian';
+
+@Pipe({
+  name: 'eNumber'
+})
+export class ENumberPipe implements PipeTransform {
+
+  transform(str: any, args?: any): any {
+    if ((str != null) && str.toString().trim() !== '') {
+      return Persian.persianToEnglishNumber(str.toString()).toString();
+    } else {
+      return '';
+    }
+  }
+
+}

src/app/p-number.pipe.ts

@@ -0,0 +1,17 @@
+import { Pipe, PipeTransform } from '@angular/core';
+import { Persian } from './persian';
+
+@Pipe({
+  name: 'pNumber'
+})
+export class PNumberPipe implements PipeTransform {
+
+  transform(str: any, args?: any): any {
+    if ((str != null) && str.toString().trim() !== '') {
+      return Persian.englishToPersianNumber(str.toString()).toString();
+    } else {
+      return '';
+    }
+  }
+
+}

src/app/persian.ts

@@ -0,0 +1,88 @@
+export class Persian {
+    static englishToPersianNumber(number) {
+        if (!number) {
+            return;
+        }
+        const englishNumbers = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '0'],
+            persianNumbers = ['۱', '۲', '۳', '۴', '۵', '۶', '۷', '۸', '۹', '۰'];
+
+        for (let i = 0, numbersLen = englishNumbers.length; i < numbersLen; i++) {
+            number = number.replace(new RegExp(englishNumbers[i], 'g'), persianNumbers[i]);
+        }
+        return number;
+    }
+
+    static persianToEnglishNumber(number) {
+        if (!number) {
+            return;
+        }
+        const englishNumbers = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '0'],
+            persianNumbers = ['۱', '۲', '۳', '۴', '۵', '۶', '۷', '۸', '۹', '۰'];
+
+        for (let i = 0, numbersLen = persianNumbers.length; i < numbersLen; i++) {
+            number = number.replace(new RegExp(persianNumbers[i], 'g'), englishNumbers[i]);
+        }
+        return number;
+    }
+
+    // TODO:: performance issue
+    static numberToPersianDigitWords(number: string | number) {
+        if (typeof number !== 'string') {
+            number = number.toString();
+        }
+        if (!isFinite(Number(number))) {
+            return '';
+        }
+        const parts = ['', 'هزار', 'میلیون', 'میلیارد', 'تریلیون', 'کوادریلیون', 'کویینتیلیون', 'سکستیلیون'];
+        const numbers = {
+            hundreds: ['', 'صد', 'دویست', 'سیصد', 'چهارصد', 'پانصد', 'ششصد', 'هفتصد', 'هشتصد', 'نهصد'],
+            tens: ['', 'ده', 'بیست', 'سی', 'چهل', 'پنجاه', 'شصت', 'هفتاد', 'هشتاد', 'نود'],
+            units: ['', 'یک', 'دو', 'سه', 'چهار', 'پنج', 'شش', 'هفت', 'هشت', 'نه'],
+            tenToNineteen: ['ده', 'یازده', 'دوازده', 'سیزده', 'چهارده', 'پانزده', 'شانزده', 'هفده', 'هجده', 'نوزده'],
+            zero: 'صفر'
+        };
+        const delimiter = ' و ';
+        // split number 3-3
+        const numberList = number
+            .split('').reverse().join('').replace(/\d{3}(?=\d)/g, '$&,')
+            .split('').reverse().join('').split(',')
+            .map((x) => {
+                return Array(4 - x.length).join('0') + x;
+            }).reverse();
+        let results;
+        results = []
+        for (let index = 0; index < numberList.length; index++) {
+            const hundredsDigit = numberList[index][0];
+            const tensDigit = numberList[index][1];
+            const unitsDigit = numberList[index][2];
+            const part = parts[index];
+            let threeDigitResult;
+            threeDigitResult = [];
+            if (hundredsDigit !== '0') {
+                threeDigitResult.push(numbers.hundreds[hundredsDigit]);
+            }
+            if (tensDigit === '1') {
+                threeDigitResult.push(numbers.tenToNineteen[unitsDigit]);
+            } else {
+                if (tensDigit !== '0') {
+                    threeDigitResult.push(numbers.tens[tensDigit]);
+                    if (unitsDigit !== '0') {
+                        threeDigitResult.push(numbers.units[unitsDigit]);
+                    }
+                } else if (unitsDigit !== '0' && unitsDigit !== '1') {
+                    threeDigitResult.push(numbers.units[unitsDigit]);
+                }
+            }
+            threeDigitResult = threeDigitResult.join(delimiter);
+            results.push(threeDigitResult + ' ' + part)
+        }
+        let result = results.filter((x) => {
+            return x.trim() !== '';
+        });
+        result = result.reverse().join(delimiter).trim();
+        if (result !== '') {
+            return result;
+        }
+        return numbers.zero;
+    }
+}

src/app/time-select/time-select.component.html

@@ -6,7 +6,7 @@
             (click)="increase('hour')">
     </button>
     <span class="dp-time-select-display-hours"
-          [innerText]="hours">
+          [innerText]="hours | pNumber">
     </span>
     <button type="button"
             class="dp-time-select-control-down"
@@ -22,7 +22,7 @@
             [disabled]="!showIncMinute"
             (click)="increase('minute')"></button>
     <span class="dp-time-select-display-minutes"
-          [innerText]="minutes">
+          [innerText]="minutes | pNumber">
     </span>
     <button type="button"
             [disabled]="!showDecMinute" class="dp-time-select-control-down"
@@ -38,7 +38,7 @@
               [disabled]="!showIncSecond"
               (click)="increase('second')"></button>
       <span class="dp-time-select-display-seconds"
-            [innerText]="seconds">
+            [innerText]="seconds | pNumber">
       </span>
       <button type="button"
               class="dp-time-select-control-down"