加载组件时不显示值

时间:2019-12-11 09:58:06

标签: angular

我有一个要在组件加载后立即显示的值。这是一个数学计算,可以计算出该值。计算只是一个下拉值乘以缓存中存储的另一个值。

这是我的代码

  ctc = 50000;

  ngOnInit() {
    this.percentage = this.memberContributionPercentages[0].value;
    this.getRetirementPercentage(event);
  }

  getRetirementPercentage(event) {
    this.percentage = event.value;
    this.totalContribution = this.ctc * (this.percentage / 100);
  }  

  <div class="total-contributions">
    <strong>Total contributions</strong>
    <p class="total-calculation">R{{totalContribution}}</p>
  </div>

当前,我的问题是该值显示NAN,有什么想法吗?总贡献是我要显示的值。

3 个答案:

答案 0 :(得分:1)

我建议为您使用的每个变量定义适当的类型。 我猜是因为您正在尝试将数字与某个字符串或任何其他数据类型相乘而发生。

不使用类型输入的其他方法之一是可以使用parseFloat:-

    this.totalContribution = parseFloat(this.ctc) * (parseFloat(this.percentage) / 100);

也许这可以解决您的问题,但这不是正确的解决方案。

答案 1 :(得分:0)

ngOnInit() {
    this.percentage = this.memberContributionPercentages[0].value;
    this.getRetirementPercentage(event);
  }

因为您没有向该value事件提供任何值,所以没有在该实例中声明任何值或未定义事件

ngOnInit() {
    this.percentage = this.memberContributionPercentages[0].value;
    this.getRetirementPercentage(this.percentage);
  }

答案 2 :(得分:0)

NAN 基本上代表 Not A Number

ngOnInit中尝试一下:

ngOnInit() {
    this.percentage = this.memberContributionPercentages[0].value;
    this.getRetirementPercentage(this.percentage);
  }