Skip to content

Commit 4db5f2a

Browse files
skrustevskrustev
committed
feat(grid): Add custom currency code, currency symbol and position overrides.
1 parent 53cb864 commit 4db5f2a

File tree

8 files changed

+45
-33
lines changed

8 files changed

+45
-33
lines changed

‎projects/igniteui-angular/src/lib/core/utils.ts‎

Lines changed: 22 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { formatDate as _formatDate, isPlatformBrowser } from '@angular/common';
1+
import { formatDate as _formatDate, getLocaleCurrencyCode, isPlatformBrowser } from '@angular/common';
22
import { Inject, Injectable, InjectionToken, PLATFORM_ID, inject } from '@angular/core';
33
import { mergeWith } from 'lodash-es';
44
import { NEVER, Observable } from 'rxjs';
@@ -584,7 +584,7 @@ export function formatDate(value: Date | string | number | null | undefined, for
584584
if (value === null || value === undefined || value === '') {
585585
return '';
586586
}
587-
if (typeof value === "string") {
587+
if (typeof value === "string" || typeof value === "number") {
588588
value = new Date(value);
589589
}
590590
let dateStyle = undefined, timeStyle = undefined;
@@ -593,10 +593,10 @@ export function formatDate(value: Date | string | number | null | undefined, for
593593
timeStyle = format;
594594
} else if (format.includes('Date')) {
595595
dateStyle = format.replace('Date', '');
596-
} else if (format.includes('Time')) {
596+
} else if (format.includes('Time')) {
597597
dateStyle = format.replace('Time', '');
598598
} else {
599-
// Match with Angular custom formatting?
599+
return getI18nManager().formatDateCustomFormat(value, locale, format);
600600
}
601601
const options: Intl.DateTimeFormatOptions = {
602602
dateStyle,
@@ -663,6 +663,24 @@ export function formatCurrency(value: number | string | null | undefined, locale
663663
return formatNumberGeneric(value, "currency", locale, digitsInfo, currencyCode, display);
664664
}
665665

666+
export function getCurrencyCode(locale: string, overrideCode?: string) {
667+
let currencyCode = 'USD';
668+
if (overrideCode) {
669+
return overrideCode;
670+
} else {
671+
try {
672+
currencyCode = getLocaleCurrencyCode(locale)
673+
} catch {
674+
// If not available the user needs to define it.
675+
}
676+
}
677+
return currencyCode;
678+
}
679+
680+
export function getCurrencySymbol(currencyCode: string, currencyDisplay?: keyof Intl.NumberFormatOptionsCurrencyDisplayRegistry,locale?: string) {
681+
return getI18nManager().getCurrencySymbol(currencyCode, currencyDisplay, locale);
682+
}
683+
666684
/** Converts pixel values to their rem counterparts for a base value */
667685
export const rem = (value: number | string) => {
668686
const base = parseFloat(globalThis.window?.getComputedStyle(globalThis.document?.documentElement).getPropertyValue('--ig-base-font-size'))

‎projects/igniteui-angular/src/lib/data-operations/filtering-strategy.ts‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,9 @@
11
import { FilteringLogic, type IFilteringExpression } from './filtering-expression.interface';
22
import { FilteringExpressionsTree, type IFilteringExpressionsTree } from './filtering-expressions-tree';
3-
import { resolveNestedPath, parseDate, formatDate, formatCurrency, columnFieldPath, formatNumber, formatPercent } from '../core/utils';
3+
import { resolveNestedPath, parseDate, formatDate, formatCurrency, columnFieldPath, formatNumber, formatPercent, getCurrencyCode } from '../core/utils';
44
import type { ColumnType, EntityType, GridType } from '../grids/common/grid.interface';
55
import { GridColumnDataType } from './data-util';
66
import { SortingDirection } from './sorting-strategy';
7-
import { getLocaleCurrencyCode } from '@angular/common';
87
import type { IFilteringState } from './filtering-state.interface';
98
import { isTree } from './expressions-tree-util';
109
import type { IgxHierarchicalGridComponent } from '../grids/hierarchical-grid/hierarchical-grid.component';
@@ -169,8 +168,9 @@ export abstract class BaseFilteringStrategy implements IFilteringStrategy {
169168
case GridColumnDataType.DateTime:
170169
case GridColumnDataType.Time:
171170
return formatDate(value, format, locale, timezone);
172-
case GridColumnDataType.Currency:
173-
return formatCurrency(value, locale, display, currencyCode || getLocaleCurrencyCode(locale), digitsInfo);
171+
case GridColumnDataType.Currency: {
172+
const currencyCodeFinal = getCurrencyCode(locale, currencyCode);
173+
return formatCurrency(value, locale, display, currencyCodeFinal, digitsInfo); }
174174
case GridColumnDataType.Number:
175175
return formatNumber(value, locale, digitsInfo);
176176
case GridColumnDataType.Percent:

‎projects/igniteui-angular/src/lib/grids/cell.component.ts‎

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -19,14 +19,14 @@
1919
AfterViewInit,
2020
booleanAttribute
2121
} from '@angular/core';
22-
import { NgClass, NgTemplateOutlet, getLocaleCurrencyCode, getCurrencySymbol } from '@angular/common';
22+
import { NgClass, NgTemplateOutlet } from '@angular/common';
2323
import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
2424

2525
import { first, takeUntil, takeWhile } from 'rxjs/operators';
2626
import { Subject } from 'rxjs';
2727

2828
import { IgxTextHighlightDirective } from '../directives/text-highlight/text-highlight.directive';
29-
import { formatCurrency, formatDate, formatPercent, PlatformUtil } from '../core/utils';
29+
import { formatCurrency, formatDate, formatPercent, getCurrencyCode, getCurrencySymbol, PlatformUtil } from '../core/utils';
3030
import { IgxGridSelectionService } from './selection/selection.service';
3131
import { HammerGesturesManager } from '../core/touch';
3232
import { GridSelectionMode } from './common/enums';
@@ -781,13 +781,12 @@ export class IgxGridCellComponent implements OnInit, OnChanges, OnDestroy, CellT
781781

782782
/** @hidden @internal */
783783
public get currencyCode(): string {
784-
return this.column.pipeArgs.currencyCode ?
785-
this.column.pipeArgs.currencyCode : getLocaleCurrencyCode(this.grid.locale);
784+
return getCurrencyCode(this.grid.locale, this.column.pipeArgs.currencyCode);
786785
}
787786

788787
/** @hidden @internal */
789788
public get currencyCodeSymbol(): string {
790-
return getCurrencySymbol(this.currencyCode, 'wide', this.grid.locale);
789+
return getCurrencySymbol(this.currencyCode, 'symbol', this.grid.locale);
791790
}
792791

793792
protected _lastSearchInfo: ISearchInfo;

‎projects/igniteui-angular/src/lib/grids/filtering/excel-style/excel-style-filtering.component.ts‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -21,12 +21,12 @@ import {
2121
DOCUMENT
2222
} from '@angular/core';
2323
import { FilteringExpressionsTree, IFilteringExpressionsTree } from '../../../data-operations/filtering-expressions-tree';
24-
import { PlatformUtil, formatDate, formatCurrency, formatNumber, formatPercent } from '../../../core/utils';
24+
import { PlatformUtil, formatDate, formatCurrency, formatNumber, formatPercent, getCurrencyCode } from '../../../core/utils';
2525
import { GridColumnDataType } from '../../../data-operations/data-util';
2626
import { Subscription } from 'rxjs';
2727
import { GridSelectionMode } from '../../common/enums';
2828
import { IgxFilterItem } from '../../../data-operations/filtering-strategy';
29-
import { getLocaleCurrencyCode, NgClass } from '@angular/common';
29+
import { NgClass } from '@angular/common';
3030
import { BaseFilteringComponent } from './base-filtering.component';
3131
import { ExpressionUI, FilterListItem, generateExpressionsList } from './common';
3232
import { ColumnType, GridType, IGX_GRID_BASE } from '../../common/grid.interface';
@@ -736,8 +736,9 @@ export class IgxGridExcelStyleFilteringComponent extends BaseFilteringComponent
736736
case GridColumnDataType.DateTime:
737737
case GridColumnDataType.Time:
738738
return formatDate(value, format, locale, timezone);
739-
case GridColumnDataType.Currency:
740-
return formatCurrency(value, locale, display, currencyCode || getLocaleCurrencyCode(locale), digitsInfo);
739+
case GridColumnDataType.Currency: {
740+
const currencyCodeFinal = getCurrencyCode(locale, currencyCode);
741+
return formatCurrency(value, locale, display, currencyCodeFinal, digitsInfo); }
741742
case GridColumnDataType.Number:
742743
return formatNumber(value, locale, digitsInfo);
743744
case GridColumnDataType.Percent:

‎projects/igniteui-angular/src/lib/grids/grid-base.directive.ts‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import { getLocaleNumberFormat, NumberFormatStyle } from '@angular/common';
21
import {
32
AfterContentInit,
43
AfterViewInit,
@@ -2885,9 +2884,7 @@ export abstract class IgxGridBaseDirective implements GridType,
28852884
if (this._currencyPositionLeft !== undefined) {
28862885
return this._currencyPositionLeft;
28872886
}
2888-
const format = getLocaleNumberFormat(this.locale, NumberFormatStyle.Currency);
2889-
const formatParts = format.split(',');
2890-
const i = formatParts.indexOf(formatParts.find(c => c.includes('¤')));
2887+
const i = getI18nManager().getCurrencyPosition(this.locale);
28912888
return this._currencyPositionLeft = i < 1;
28922889
}
28932890

‎projects/igniteui-angular/src/lib/grids/grid/groupby-row.component.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import {
1111
OnDestroy,
1212
Inject
1313
} from '@angular/core';
14-
import { NgTemplateOutlet,getLocaleCurrencyCode } from '@angular/common';
14+
import { NgTemplateOutlet } from '@angular/common';
1515

1616
import { takeUntil } from 'rxjs/operators';
1717
import { Subject } from 'rxjs';
@@ -28,6 +28,7 @@ import { IgxCheckboxComponent } from '../../checkbox/checkbox.component';
2828
import { IgxBadgeComponent } from '../../badge/badge.component';
2929
import { IgxIconComponent } from '../../icon/icon.component';
3030
import { IgxColumnFormatterPipe, IgxCurrencyFormatterPipe, IgxDateFormatterPipe, IgxNumberFormatterPipe, IgxPercentFormatterPipe } from '../common/pipes';
31+
import { getCurrencyCode } from '../../core/utils';
3132

3233
@Component({
3334
changeDetection: ChangeDetectionStrategy.OnPush,
@@ -139,8 +140,7 @@ export class IgxGridGroupByRowComponent implements OnDestroy {
139140

140141
/** @hidden @internal */
141142
public get currencyCode(): string {
142-
return this.groupRow.column.pipeArgs.currencyCode ?
143-
this.groupRow.column.pipeArgs.currencyCode : getLocaleCurrencyCode(this.grid.locale);
143+
return getCurrencyCode(this.grid.locale, this.groupRow.column.pipeArgs.currencyCode);
144144
}
145145

146146
constructor(

‎projects/igniteui-angular/src/lib/grids/summaries/summary-cell.component.ts‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,10 @@ import {
44
IgxSummaryResult
55
} from './grid-summary';
66
import { GridColumnDataType } from '../../data-operations/data-util';
7-
import { getLocaleCurrencyCode, getLocaleCurrencySymbol, NgTemplateOutlet } from '@angular/common';
7+
import { getLocaleCurrencySymbol, NgTemplateOutlet } from '@angular/common';
88
import { ISelectionNode } from '../common/types';
99
import { ColumnType } from '../common/grid.interface';
10-
import { formatCurrency, formatDate, formatNumber, formatPercent, trackByIdentity } from '../../core/utils';
10+
import { formatCurrency, formatDate, formatNumber, formatPercent, getCurrencyCode, trackByIdentity } from '../../core/utils';
1111

1212
@Component({
1313
changeDetection: ChangeDetectionStrategy.OnPush,
@@ -103,8 +103,7 @@ export class IgxSummaryCellComponent {
103103
* @hidden @internal
104104
*/
105105
public get currencyCode(): string {
106-
return this.column.pipeArgs.currencyCode ?
107-
this.column.pipeArgs.currencyCode : getLocaleCurrencyCode(this.grid.locale);
106+
return getCurrencyCode(this.grid.locale, this.column.pipeArgs.currencyCode);
108107
}
109108

110109
/**

‎projects/igniteui-angular/src/lib/services/exporter-common/base-export-service.ts‎

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { EventEmitter } from '@angular/core';
2-
import { cloneArray, cloneValue, columnFieldPath, IBaseEventArgs, resolveNestedPath, yieldingLoop } from '../../core/utils';
2+
import { cloneArray, cloneValue, columnFieldPath, getCurrencyCode, IBaseEventArgs, resolveNestedPath, yieldingLoop } from '../../core/utils';
33
import { GridColumnDataType, DataUtil } from '../../data-operations/data-util';
44
import { ExportUtilities } from './export-utilities';
55
import { IgxExporterOptionsBase } from './exporter-options-base';
@@ -9,7 +9,7 @@ import { IGroupingState } from '../../data-operations/groupby-state.interface';
99
import { getHierarchy, isHierarchyMatch } from '../../data-operations/operations';
1010
import { IGroupByExpandState } from '../../data-operations/groupby-expand-state.interface';
1111
import { IFilteringState } from '../../data-operations/filtering-state.interface';
12-
import { DatePipe, FormatWidth, getLocaleCurrencyCode, getLocaleDateFormat, getLocaleDateTimeFormat } from '@angular/common';
12+
import { DatePipe, FormatWidth, getLocaleDateFormat, getLocaleDateTimeFormat } from '@angular/common';
1313
import { IGroupByRecord } from '../../data-operations/groupby-record.interface';
1414
import { ColumnType, GridType, IPathSegment } from '../../grids/common/grid.interface';
1515
import { FilterUtil } from '../../data-operations/filtering-strategy';
@@ -1162,9 +1162,7 @@ export abstract class IgxBaseExporter {
11621162
};
11631163

11641164
if (column.dataType === 'currency') {
1165-
columnInfo.currencyCode = column.pipeArgs.currencyCode
1166-
? column.pipeArgs.currencyCode
1167-
: getLocaleCurrencyCode(this.locale);
1165+
columnInfo.currencyCode = getCurrencyCode(this.locale, column.pipeArgs.currencyCode);;
11681166

11691167
columnInfo.displayFormat = column.pipeArgs.display
11701168
? column.pipeArgs.display

0 commit comments

Comments
 (0)