AngularJS如何调整number过滤器实现印度卢比格式的逗号分隔数字展示

AngularJS内置的number过滤器默认采用国际通用的千位分隔规则，无法适配印度卢比特有的「后三位分隔、前序每两位分隔」的数字分组规则，可通过自定义过滤器实现需求：

方法1：基于原生国际化API实现（推荐） #

直接调用浏览器内置的Intl.NumberFormat接口，使用印度区域en-IN的原生格式化规则，无需手动处理正则匹配，兼容性好且逻辑更严谨：

// 在你的AngularJS模块中注册自定义过滤器
angular.module('yourAppName', [])
.filter('indianCurrency', function() {
  return function (amount, decimal = 2) {
    if (isNaN(parseFloat(amount))) return 'Rs. 0.00';
    return new Intl.NumberFormat('en-IN', {
      minimumFractionDigits: decimal,
      maximumFractionDigits: decimal
    }).format(amount).replace('₹', 'Rs. ');
  };
});

模板中使用方式：

{{total | indianCurrency}}

输出效果即为你需要的Rs. 12,36,762.51，如需调整小数位数可传参：{{total | indianCurrency:3}}

方法2：手动正则匹配实现 #

如果需要兼容极低版本不支持Intl接口的浏览器，可以手动处理数字分组逻辑：

angular.module('yourAppName', [])
.filter('indianCurrency', function() {
  return function (amount, decimal = 2) {
    if (isNaN(parseFloat(amount))) return 'Rs. 0.00';
    // 拆分整数与小数部分
    let num = Number(amount).toFixed(decimal);
    let [intPart, decimalPart] = num.split('.');
    // 处理整数部分分组
    let lastThree = intPart.slice(-3);
    let prefixPart = intPart.slice(0, -3);
    if (prefixPart) lastThree = ',' + lastThree;
    let formattedInt = prefixPart.replace(/\B(?=(\d{2})+(?!\d))/g, ',') + lastThree;
    return `Rs. ${formattedInt}.${decimalPart}`;
  };
});

使用方式和第一种方法完全一致。

内容的提问来源于stack exchange，提问作者vellai durai