时间戳

首页 > 解决方案 > Angular中的递增/递减数字

angular - Angular中的递增/递减数字

问题描述

我想将数字从 1 增加到 50。

我尝试使用此代码，如下所示，但功能不起作用。

演示

在html中我有：

            <Button text="+" (tap)="plus()"></Button>
            <Button text="-" (tap)="minus()"></Button>

在 ts 我必须发挥作用，如下所示：

 plus() {
        var first: number = 1;
        var last: number = 50;
        let num = first + 1
        console.log("Value of num1 after increment ", first)
        if (num === last) {
            console.log('disable')
        } else {
            console.log('num plus', num)
        }
    }

    minus() {
        var first1: number = 1;
        var last1: number = 50;
        let num1 = first1 - 1
        console.log("Value of num1 after decr ", first1)
        if (num1 === last1) {
            console.log('disable')
        } else {
            console.log('num minus', num1)
        }
    }

请任何想法，如何增加/减少数字？

标签： angularnativescriptincrementdecrement

解决方案

在外面声明你的变量plus()和minus()方法。我猜first和数字是不变的。last

app.component.ts：

export class AppComponent {
  name = "Angular";
  last1 = 50;
  last2 = -50;
  num1 = 0;
  num2 = 0;

  plus() {
    if (this.num1 === this.last1) {
      console.log("disable");
    } else {
      this.num1++;
      console.log("Value of num1 after increment ", this.num1);
    }
  }
  minus() {
    if (this.num2 === this.last2) {
      console.log("disable");
    } else {
      this.num2--;
      console.log("Value of num1 after decr ", this.num2);
    }
  }
}

app.component.html：

<Button (click)="plus()" class="btn">+</Button>
<Button (click)="minus()" class="btn">-</Button>

<p>Num1: {{num1}}</p>
<p>Num2: {{num2}}</p>

推荐阅读