AngularJS中货币过滤器的Javascript代码无法使用自定义符号

Javascript code for currency filter in AngularJS not working with custom symbols

本文关键字：自定义 符号 代码 货币 过滤器 Javascript AngularJS      更新时间：2023-09-26

我有下面的自定义过滤器，如果输入等于零，它会返回一个"不可用"字符串，或者在应用自定义货币符号（在这种情况下，是卢比符号）后返回输入。这是代码：

(function(){
   angular.module('TestApp')
   .filter('availability', function($filter){
        return function(input){
            if(input == null){
              return "Not Available";
            }
            var test = $filter('currency')(input,"&#8377",0);
            return test;
        }
   });
})();

然而，并没有达到期望的结果。相反，货币符号的原始字符串被打印在输入的前面。我在HTML代码中使用了相同的货币符号，如下所示，它很有效：

{{value.Charge | currency:"₹":0}}

我是不是错过了一些显而易见的东西？如果没有，是否有解决方法？

当您在自定义筛选器中使用$filter('currency')(input,"&#8377",0);时，"&#8377"只是一个字符串。它永远不会被解码成相应的HTML实体。

如果您将它从HTML传递到过滤器，它将正常工作，因为HTML在它到达过滤器之前对它进行解码。

否则，如果您想在JavaScript中对值进行硬编码，则需要自己对其进行解码。SO上有几个例子很容易找到，比如这个答案，我在下面的硬编码例子中使用了这个答案。

angular.module("app", [])
  .controller("controller", function($scope) {
    $scope.amount = 32;
  })
  .filter('availability', function($filter) {
    return function(input, symbol) {
      console.log(symbol);
      if (input == null) {
        return "Not Available";
      }
      var test = $filter('currency')(input, symbol, 0);
      return test;
    }
  })
  .filter('hardcoded', function($filter) {
    return function(input) {
      if (input == null) {
        return "Not Available";
      }
      var test = $filter('currency')(input, decodeEntities("₹"), 0);
      return test;
    }
  });
// From https://stackoverflow.com/questions/5796718/html-entity-decode/9609450#9609450
var decodeEntities = (function() {
  // this prevents any overhead from creating the object each time
  var element = document.createElement('div');
  function decodeHTMLEntities (str) {
    if(str && typeof str === 'string') {
      // strip script/html tags
      str = str.replace(/<script[^>]*>(['S's]*?)<'/script>/gmi, '');
      str = str.replace(/<'/?'w(?:[^"'>]|"[^"]*"|'[^']*')*>/gmi, '');
      element.innerHTML = str;
      str = element.textContent;
      element.textContent = '';
    }
    return str;
  }
  return decodeHTMLEntities;
})();
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script>
<div ng-app="app" ng-controller="controller">
  <input ng-model="amount" />
  <p>
    Currency Filter: {{amount | currency:"&#8377;":0}}
  </p>
  <p>
    Custom Filter: {{amount | availability:"&#8377;"}}
  </p>
  <p>
    Hard-coded string in Custom Filter: {{amount | hardcoded}}
  </p>
</div>

相关文章：