我可以在Angular中设置数字的小数吗？

Question

我试图将小数样式设置为如下所示：

没有成功，我想我需要制作我自己的过滤器，尝试但也没有成功，我想这是因为我在一个州内使用它。

这里是我用于编号的代码：

<h2><sup>$</sup>{{salary | number:0}}<sub>.00</sub></h2>

使用此范围 .app iam内部：

$ scope.salary = 9000;

事情是，数字可以是用户工资，它从输入中得到数字，在其他地方我也有更多带小数的数字。

可能的解决方案：

• 仅从值中提取小数，然后在de中打印 标记。
• 使用过滤器执行此操作？

Answer 1

使用将分割数量并生成正确HTML的指令。 For example：

app.directive('salary', function(){
  return {
      restrict: 'E'
      , scope: {
          salary: '@'
      }
      , controller: controller
      , controllerAs: 'dvm'
      , bindToController: true
      , template: '<h2><sup>$</sup>{{ dvm.dollar }}<sub>.{{ dvm.cents }}</sub></h2>'
  };

  function controller(){
    var parts = parseFloat(this.salary).toFixed(2).split(/\./);
    this.dollar = parts[0];
    this.cents = parts[1];
  }
});

Answer 2

最简单的解决方案是将数字分成小数部分和整数部分：

＆＃13;

＆＃13;

var number = 90000.99111;

console.log(number % 1);

＆＃13;

＆＃13;

＆＃13;

＆＃13;

在控制器中使用它，并将范围变量拆分为对象：

 $scope.salary = {
    whole: salary,
    decimal: salary % 1
  }

Protip：使用这样的对象比使用两个范围变量来提高性能