租金计算器点击计算后输入框自动更新问题求助

问题根源是你在计算逻辑里直接修改了和输入框双向绑定的rent变量，导致输入框会同步更新为最终计算结果。要取消这个行为，只需改用临时变量完成计算，不改动原始的rent变量即可。

修改后的TypeScript代码如下：

export class RentCalculatorComponent {
  constructor() { }

  increase!: number;
  months!: number;
  rent!: number;
  total: any[] = [];

  calculate() {
    // 清空之前的计算结果
    this.total = [];
    // 用临时变量存储初始租金，避免修改绑定到输入框的rent
    let currentRent = this.rent;

    for (let i = 0; i < this.months; i++) {
      currentRent = currentRent + currentRent * this.increase / 100;
      // 保留两位小数后存入结果数组
      this.total.push(currentRent.toFixed(2));
      console.log(this.total[i]);
    }
  }
}

修改说明： #

• 新增currentRent临时变量，所有计算基于该变量进行，不会影响输入框绑定的rent值
• 每次计算前重置total数组，避免多次点击计算时结果叠加
• 用push方法向数组添加元素，写法更简洁直观

HTML代码无需任何修改，这样点击计算后，输入框里的初始租金值就不会被自动更新了。

内容的提问来源于stack exchange，提问作者Shahzeb Hassan