Angular Currency Pipe无GYD符号，如何在App.module中配置自定义符号？

Angular 14+ 配置方案 #

在app.module.ts中通过provideCurrencyConfig添加自定义货币符号映射：

1. 导入所需依赖：

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { provideCurrencyConfig } from '@angular/common';
import { AppComponent } from './app.component';

2. 在模块的providers数组中配置货币符号：

@NgModule({
  declarations: [AppComponent],
  imports: [BrowserModule],
  providers: [
    provideCurrencyConfig({
      currencySymbolMap: {
        GYD: 'GY$'
      }
    })
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

完成配置后，原模板代码：

<h1> My rate is : {{'202' | currency:'GYD'}}</h1>

即可输出：GY$ 202

Angular 13及以下 配置方案 #

对于旧版本Angular，需要扩展已有locale的货币符号映射：

1. 导入依赖并扩展locale数据：

import { NgModule, LOCALE_ID } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { registerLocaleData } from '@angular/common';
import localeEn from '@angular/common/locales/en';
import { AppComponent } from './app.component';

// 扩展en locale的货币符号映射，添加GYD对应符号
localeEn[5].GYD = 'GY$';
registerLocaleData(localeEn);

2. 在providers中指定使用的locale：

@NgModule({
  declarations: [AppComponent],
  imports: [BrowserModule],
  providers: [
    { provide: LOCALE_ID, useValue: 'en-US' }
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

同样使用原模板代码即可得到期望输出。

内容的提问来源于stack exchange，提问作者Dinesh Kanivu