Как с динамическим количеством + и - в ионном 2? - PullRequest
Новая
       56

Как с динамическим количеством + и - в ионном 2?

0 голосов
/ 08 октября 2018 
<p><b>Qty :</b>
    <ion-icon name="remove-circle" (click)="decrement()"></ion-icon>
      {{cart.qty}}
    <ion-icon name="add-circle" (click)="increment()"></ion-icon>
 </p>

Вот код cart.ts 

ionViewDidLoad() {
        var param = "user_id=" + this.user_id;
        this.UtilsService.makeAPICall(this.UtilsService.postMethod, 
          this.UtilsService.CartItemAPI, param, (response) => {
          if(response.data)
          { 
            this.Data = response["data"];
            this.Qty = response["qty"];
            localStorage.setItem("qty", this.Qty);
          }  
        });
      }

Как + и - количество в этом коде?

1 Ответ

0 голосов
/ 08 октября 2018

Есть много способов сделать это, но так как вы сохраняете количество в вашем localStorage, для этого есть лучший способ.Таким образом, в вашем .ts файле вы будете иметь 

decrement = () => {
  // you don't want it to decrement to lower than 0
  if (this.Qty > 0 ) {
    this.Qty -= 1;
    localStorage.setItem("qty", this.Qty);
  }
}

increment = () => {
  this.Qty += 1;
  localStorage.setItem("qty", this.Qty);
}

Также вы не можете получить к нему доступ с помощью {{cart.qty}}, вместо этого вам нужно {{Qty}}.

Если вы этого не сделаетенужно все время сохранять его в localStorage, вы можете сделать это встроенным в ваш HTML 

<p><b>Qty :</b>
  <!-- checking if it's 0 before removing 1 from the total quantity -->
  <ion-icon name="remove-circle" (click)="Qty = Qty > 0 ? Qty - 1 : Qty"></ion-icon>
      {{Qty}}
  <ion-icon name="add-circle" (click)="Qty += 1"></ion-icon>
</p>

Надеюсь, это поможет.

...