使用 Angular Pipes 将一位数变为两位数答案

【问题标题】：Making one digit number as two digit using Angular Pipes使用 Angular Pipes 将一位数变为两位数
【发布时间】：2020-12-28 17:42:04
【问题描述】：

我想让 1 在 html 上看起来像 01，类似地 11 像 11。

如果有这样的过滤器，谁能帮助我。这是一个示例demo code

【问题讨论】：

您好，提示一下，在进行研究时使用术语left padding
这可能会对您有所帮助。 stackoverflow.com/a/50836807/9183405
这能回答你的问题吗？ Angular2 or TypeScript Left padding a String with Zeros

标签： angular angular-pipe

【解决方案1】：

您可以使用padStart 方法在字符串的开头添加特定字符，直到达到一定长度。

import { Component, OnInit, Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'numberFormat'
})
export class NumberformatComponent implements PipeTransform {

  constructor() { }

   transform(n: string) {
     return n.padStart(2, '0');
   }
}

【讨论】：

【解决方案2】：

Angular 为这些情况提供了Decimal Pipes。查看类似的答案here。

<span>{{ number | number:'2.0' }}</span>

十进制管道的参数接受代表您所需格式的字符串。根据docs，格式如下：

号码：'{minIntegerDigits}.{minFractionDigits}-{maxFractionDigits}'

地点：

minIntegerDigits：小数点前最小整数位数。默认值为 1。

minFractionDigits：小数点后的最小位数。默认值为 0。

maxFractionDigits：小数点后的最大位数。默认值为 3。

【讨论】：