The angular framework comes with a pipeline for formatting numbers into currency, which I didn't do at first, so I found some information from the Internet, and then implemented it myself, the code is as follows:
Prefixes and suffixes are supported. We can actually use CurrencyPipe directly.
CurrencyPipe
Convert numbers into strings of amounts and format them according to localization rules that determine the size of the group, separators, decimal characters, and other configuration items related to the localization environment.
Enter a value
value any
The number to be formatted as currency.
parameter
| currencyCode | string | Currency codes in ISO 4217, such as USD for USD and EUR for EUR. The default currency code can be configured with the DEFAULT_CURRENCY_CODE injection token. Optional. The default value is undefined. | | display | string | boolean | The format of the currency indicator with valid values includes: code: Displays the currency code (e.g. USD). symbol(default): Displays a currency symbol (e.g. $). symbol-narrow: uses the narrowing symbol of the region, which includes two symbols. For example, the Canadian dollar has a symbol for CA$, and its narrowing symbol is $. If the area does not have a narrowing symbol, it uses its standard symbol. String: Uses the specified string value instead of the currency code or symbol. For example, an empty string will remove the currency code or symbol. Boolean (deprecated from v5): true for currency symbols, false for currency symbols. Optional. The default value is 'symbol'. | | digitsInfo | string | The option to display the numbers is specified by a string in the following format: {minIntegerDigits}. {minFractionDigits}-{maxFractionDigits}。 minIntegerDigits: The smallest number of digits before the decimal point. The default is 1. minFractionDigits: The smallest number of digits after the decimal point. The default is 0. maxFractionDigits: The maximum number after the decimal point, which defaults to 3. If not provided, the number is properly formatted according to the ISO 4217 specification. For example, the Canadian dollar has 2 digits, while the Chilean peso does not. Optional. The default value is undefined. | | locale | string | The localized format code to use. If not provided, use the value of LOCALE_ID, which defaults to en-US. See Setting up a region for your app. Optional. The default value is undefined. |
The renderings are as follows:
|