web-dev-qa-db-ja.com

Angular2またはTypeScriptゼロで文字列を左にパディング

9という番号がありますが、文字列「09」として必要です。

私は自分のロジックを書くことができることを知っています。しかし、私はそれを埋めることができる暗黙のユーティリティ関数を探しています。

TypeScriptでangular2を使用しています。 this のようなものを探しています。

Javaのように似ている

String.format("%010d", Integer.parseInt(mystring));
stringangulartypescriptpadding
21
Partha Sarathi Ghosh

このために独自の関数を作成できます。数値をフォーマットするには、最初に文字列に変換する必要があります。

function pad(num, size) {
    let s = num+"";
    while (s.length < size) s = "0" + s;
    return s;
}

TypeScript

pad(num:number, size:number): string {
    let s = num+"";
    while (s.length < size) s = "0" + s;
    return s;
}

編集：これを行うには、いくつかのより良い、よりパフォーマンスの良い方法があります。この回答の説明を参照してください： https://stackoverflow.com/a/9744576/1734678 （時間があれば、提出された回答のほとんどを読むことをお勧めします）

更新：ECMAScript 2017で文字列の埋め込みがサポートされるようになりました

str.padStart(targetLength [, padString])
str.padEnd(targetLength [, padString])

チェック https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/padStart

33
Evans M.

Angular v4であるため、先行ゼロを簡単に追加できるDecimalPipeがあります。 https://angular.io/api/common/DecimalPipe

HTMLでは、次のようなものを使用できます。

{{ myNumber | number:'2.0' }}

13
maczos

以下のテンプレートのいずれかをHTMLで使用できます

{{ ("00" + 9).slice(-2) }} // 09

または

{{ 9 | number: '2.' }} // 09

またはコンポーネントtsコードファイル内

var x = ("00" + 9).slice(-2);
6
ElasticCode

最新のTypeScriptを使用すると、次のことができます。

let myStr:string = padLeft('123', '0', 6);  // '000123'

padLeft(text:string, padChar:string, size:number): string {
    return (String(padChar).repeat(size) + text).substr( (size * -1), size) ;
}
4
Steven Scott
public padIntegerLeftWithZeros(rawInteger: number, numberOfDigits: number): string {
    let paddedInteger: string = rawInteger + '';
    while (paddedInteger.length < numberOfDigits) {
        paddedInteger = '0' + paddedInteger;
    }
    return paddedInteger;
}

public zeroPadIntegerLeft3Digits(rawInteger: number): string {
    return this.padIntegerLeftWithZeros(rawInteger, 3);
}
1
CalvinDale

そのためのパイプを作成できます

{{ID |LeftPadFilter: ID}}



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

@Pipe({
    name: 'LeftPadFilter',
    pure: false
})
export class LeftPadFilter implements PipeTransform {
    transform(item: string): string {
        return (String('0').repeat(2) + item).substr((2 * -1), 2);
    }
}
0
Kevin