Question

我正在尝试使用带有TypeScript的Angular在HTML文件中进行此操作：{{(i / 5) % 3}}。

问题是当i / 5未返回自然数时，它无法继续操作% 3部分。所以问题是：如何截断i / 5以获得可接受的操作结果？

顺便说一下，我尝试使用JavaScript函数Math.trunc(i / 5)但是我收到一条错误消息：

＆＃39;无法读取undefined＆＃39;
的属性trunc

Answer 1

我无法理解这个问题。但是，你可以试试 Math.floor(i/5) % 3。当你除以负数时，这会产生错误的结果。

Answer 2

您可以使用三种不同的Math API。

Math.floor总是给你最低的数字：

Math.floor( 1 / 5 ) // 0
Math.floor( 4 / 5 ) // 0

Math.ceil总是给你最高的数字：

Math.ceil( 1 / 5 ) // 1
Math.ceil( 4 / 5 ) // 1

Math.round为您提供最接近的那个：

Math.round( 1 / 5 ) // 0
Math.round( 4 / 5 ) // 1

Answer 3

不确定这是否是你想要的。您可以尝试使用DecimalPipe：

{{((i / 5) | number:'1.0-0') % 3}}

但看起来上面就是四舍五入。

Answer 4

这个问题与TypeScript无关。 TypeScript不提供新的运算符或函数或截断数字的方法。 TypeScript只是JavaScript之上的一个类型层。

这是一个Angular问题。您不能在模板中使用Math（任何其他全局变量）。您的选择是：

(~~(i/5)) % 3
(i/5 - (i/5) % 1) % 3
在TypeScript文件中计算

Answer 5

编写用于截断的自定义管道

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

@Pipe({
    name: 'truncateNum'
})
export class TruncateNumberPipe extends DecimalPipe implements PipeTransform {
    transform(value: any, digitsInfo?: string): string | null {

        const NUMBER_FORMAT_REGEXP = /^(\d+)?\.((\d+)(-(\d+))?)?$/;
        const parts = digitsInfo.match(NUMBER_FORMAT_REGEXP);

        let maxFraction;

        if (parts === null) {
            throw new Error(`${digitsInfo} is not a valid digit info for number pipes`);
        }

        if (parts[5] != null) {  // max fraction digits
            maxFraction = parseIntAuto(parts[5]);
        }

        return maxFraction ? super.transform(truncateToDecimals(strToNumber(value), maxFraction), digitsInfo) : super.transform(value, digitsInfo);
    }

}

function parseIntAuto(text: string): number {
    const result: number = parseInt(text);
    if (isNaN(result)) {
        throw new Error('Invalid integer literal when parsing ' + text);
    }
    return result;
}

/**
* truncate to decimal place.
*/
function truncateToDecimals(num, dec) {
    const calcDec = Math.pow(10, dec);
    return Math.trunc(num * calcDec) / calcDec;
}
/**
* Transforms a string into a number (if needed).
*/
function strToNumber(value: number | string): number {
    // Convert strings to numbers
    if (typeof value === 'string' && !isNaN(Number(value) - parseFloat(value))) {
        return Number(value);
    }
    if (typeof value !== 'number') {
        throw new Error(`${value} is not a number`);
    }
    return value;
}

Answer 6

您可以使用Math.trunc

Math.trunc(1.4) // 1
Math.trunc(1.9) // 1

如何截断打字稿中的数字

6 个答案: