我的Typescript类中有三个变量:

A:number;
B:number;
C:number;

在课程的另一部分,我try 将两个变量A和B相加:

this.C = this.A+this.B; // A =20 and B = 50;

我在html模板中显示C

<span>{{C}}</span>

我的问题是,我得到的不是两个变量(20+50=70)的加法,而是串联(2050)!!

谁能帮帮我吗?

UPDATE :

以下是导致问题的确切代码部分:

goTo(page:number,type:script) {
    //    
    this.pageFirstLineNumber = page;
    this.pageLastLineNumber = page + this.LINE_OFFSET; //concatenation!!
}

请注意,pageLastNumber被声明为数字类型,LINE_OFFSET是olso数字类型,我已经找到了这个问题的解决方案,但是typescript编译器输出了一个错误(禁止判断):

////
....
this.pageFirstLineNumber = eval(page.toString()); // now It works !!
this.pageLastLineNumber = page + this.LINE_OFFSET; //concatenation!!

UPDATE

以下是LINE_OFFSET变量的声明:

private _calculateOffset(fontSize: number) {
    let linesDiff = (fontSize * 27) / 14;
    let lines:number = 27 - (linesDiff - 27);
    this.LINE_OFFSET = Math.floor(lines);
    if (fontSize >= 17 && fontSize <= 20) {
        this.LINE_OFFSET += (Math.floor(fontSize / 3) - 2);
    }
    if (fontSize > 20 && fontSize <= 23) {
        this.LINE_OFFSET += (Math.floor(fontSize / 2) - 2);
    }
    if (fontSize > 23 && fontSize <= 25) {
        this.LINE_OFFSET += (Math.floor(fontSize / 2));}
    if (fontSize > 25 && fontSize <= 27) {
        this.LINE_OFFSET += (Math.floor(fontSize / 2) + 1);
    }
    if (fontSize > 27 && fontSize <= 30) {
        this.LINE_OFFSET += (Math.floor(fontSize / 2) + 4);
    }
}

推荐答案

当你在一个接口中声明一个属性是number,那么它只作为一个声明,不会被翻译成javascript.

例如:

interface Response {
    a: number;
    b: number;
}

let jsonString = '{"a":"1","b":"2"}';
let response1 = JSON.parse(jsonString) as Response;

console.log(typeof response1.a); // string 
console.log(typeof response1.b); // string
console.log(response1.a + response1.b); // 12

如您所见,json将ab作为字符串而不是数字,并且在接口中将它们声明为数字对运行时结果没有影响.

如果您从服务器获得的信息被编码为字符串而不是数字,那么您需要转换它们,例如:

let response2 = {
    a: Number(response1.a),
    b: Number(response1.b)
} as Response;

console.log(typeof response2.a); // number 
console.log(typeof response2.b); // number
console.log(response2.a + response2.b); // 3

(entire code in playground)

Typescript相关问答推荐

如何在ts中使用函数重载推断参数类型

在TypeScript中使用泛型的灵活返回值类型

如何在TypeScript中将一个元组映射(转换)到另一个元组?

返回具有递归属性的泛型类型的泛型函数

接口中函数的条件参数

角效用函数的类型推断

是否存在类型联合的替代方案,其中包括仅在某些替代方案中存在的可选属性?

是否可以基于对象的S属性值[]约束对象的其他属性值用于类型化的对象数组?

限制返回联合的TS函数的返回类型

CDK从可选的Lambda角色属性承担角色/复合主体中没有非空断言

有什么方法可以类型安全地包装import()函数吗?

如何将定义模型(在Vue 3.4中)用于输入以外的其他用途

声明文件中的类型继承

常量类型参数回退类型

如何按属性或数字数组汇总对象数组

为什么Typescript只在调用方提供显式泛型类型参数时推断此函数的返回类型?

为什么特定的字符串不符合包括该字符串的枚举?

如何键入派生类的实例方法,以便它调用另一个实例方法?

可以用任意类型实例化,该类型可能与

如何判断路由或其嵌套路由是否处于活动状态?