web-dev-qa-db-fra.com

Typescript: Essayer d'ajouter deux variables mais en obtenir la concaténation

J'ai trois variables dans ma classe TypeScript: 

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

dans une autre partie de la classe, j'essaie de faire l'addition des deux variables A et B:

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

et j'affiche C dans le modèle html 

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

Mon problème est qu'au lieu d'obtenir l'ajout de la variable DEUX (20+50=70), je reçois la concaténation (2050) !!

Quelqu'un peut m'aider s'il vous plaît?

METTRE &AGRAVE; JOUR : 

Voici la partie de code exacte qui pose problème:

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

Notez que pageLastNumber est déclaré en tant que type de numéro. LINE_OFFSET est également un type de numéro. J'ai trouvé une solution à ce problème mais le compilateur TypeScript a généré une erreur (valeur interdite): 

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

METTRE &AGRAVE; JOUR

Voici la déclaration de la variable 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);
    }
}
javascripttypescriptaddition
7
Nacim Idjakirene

Lorsque vous déclarez dans une interface qu'une propriété est une number, alors elle reste en tant que déclaration uniquement, elle ne sera pas traduite en javascript. 

Par exemple:

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

Comme vous pouvez le constater, json a les a et b sous forme de chaînes et non sous forme de nombres et leur déclaration en tant que nombres dans l'interface n'a aucun effet sur le résultat d'exécution.

Si ce que vous obtenez de votre serveur est codé sous forme de chaînes au lieu de nombres, vous devrez les convertir, par exemple:

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

( code entier dans la cour de récréation )

14
Nitzan Tomer

ajoutez les nombres avec +:

let a = +b + +c;

ref

11
Marvin Zumbado

Le problème est que la conversion de type de variable n’a pas été effectuée . Vous devez procéder comme suit.

A: parseInt (nombre); B: parseInt (nombre);

alors vous obtiendrez la somme C = A + b au lieu de la concaténation.

1
Smit Shah

Cela signifie qu'il existe des valeurs de chaîne dans les variables A ou B. Vérifiez votre code pour détecter les éléments dangereux, je parle de transtypage en <any> et de transtypage des réponses du serveur aux interfaces. Cela pourrait entraîner des valeurs string dans des variables number.

0
Tamas Hegedus

Enfin, je trouve la cause de l’erreur. La variable de page est extraite du modèle html (c’est une valeur d’entrée). Elle est définie comme un type de numéro dans le paramètre function, mais en réalité il s’agit d’une chaîne et TypeScript ne peut pas vérifier le type de variable modèle html, alors quand un essai parseInt (page) statique typping met en évidence une erreur! J'ai choisi le problème en donnant à la variable de page un "" type, puis en appliquant parseInt à la variable de page.

0
Nacim Idjakirene

J'ai rencontré un problème similaire que j'ai pu résoudre comme suit:

C:number =0;
A:number=12;
B:number=0.4;
C= Number.parseInt(A.toString()) + Number.parseFloat(B.toString());
console.log("C=" + C );

semble stupide, convertir un nombre en chaîne et ré-analyser en nombre, mais c’est ainsi que j’ai résolu mon problème.

0
pritesh agrawal