如何在导出类中将输出声明为整数类型答案

【问题标题】：How to declare output as an integer type in export class如何在导出类中将输出声明为整数类型
【发布时间】：2019-07-09 03:48:03
【问题描述】：

我需要一个函数的帮助，该函数需要返回用户在输入框中输入的整数的总和。

它将输出作为总数返回，但通常只是连接数字。例如如果 input1 是 1，而 input2 是 2，而不是 3，它将返回 12。我知道这是因为我在导出函数中将它定义为字符串。如何将其设置为整数类型并将其作为整数类型返回？

这是我的 component.ts 文件。模板定义输入如下：

  <div class="col-md-2"><input ng-model='input1' type="number" 
  required></div>

  <div class="col-md-2"><input ng-model='input2' type="number"         
  required></div>

  <div class="col-md-4">{{Test()}}</div>

我的导出函数如下所示：

   export class myPageComponent implements OnInit {
   constructor(public userInfo : UserService, public pageInfo: 
    PageService, private http: Http ) {
    };

   input1: string = '';
   input2: string= '';

   Test():string {

   return (this.input1 + this.input2);

   }

【问题讨论】：

标签： angular typescript mean

【解决方案1】：

我认为下面的代码应该可以工作，如果你绑定input1和input2并获取input1和input2的值，该值可以是一个字符串，此时你需要将字符串转换为数字。

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  name = 'Sum of two integer value';
  input1: number;
  input2: number;

  Test(): number {
    const sum = (!this.input1 ? 0 : +this.input1) + (!this.input2 ? 0 : +this.input2)
    return !sum ? null : sum;
  }
}

DEMO

【讨论】：

我尝试了您的解决方案。它给出了页面上显示的“0”的初始值，如果可以的话，我想避免。
嗨 Sohel，每当我使用 parseInt 函数时，它都会给我错误“数字”类型的参数不能分配给“字符串”类型的参数”。我尝试了你的第一个解决方案。它给出了“ NaN' 仍在显示。它仅在我将输入初始化为 0 时才有效。但在那种情况下，它们显示为 0。
嗨 Shoel，有没有办法删除 Total 下显示的 0。有效的解决方案很有帮助！
这正是我想要的！谢谢一百万！

【解决方案2】：

试试：

Input1: number; Input2: number;

并从函数中删除字符串。

【讨论】：

嗨 Herdi，我试过了。它现在正在部分工作。唯一的问题是在页面加载开始时，测试函数的结果编号显示为“NaN”。只有当我输入所有整数时它才会消失，因为当时所有整数的总和正确显示。知道如何解决这个问题吗？
试试parseInt(this.input1)+parseInt(this.input2)。
嗨赫迪。我试过这个。它给了我错误“'number'类型的参数不能分配给'string'类型的参数”
设置默认值为0；例如input 1: number = 0; input2: number=0;