Угловой |Ionic 3 - Как создать инкрементную кнопку продукта?

Question

Я прочитал много уроков, но что-то еще не ясно.

Я пытаюсь создать кнопку уменьшения приращения, но безуспешно.

У меня есть несколько h3 в ионном списке.Это мое мнение:

<ion-step description="Step1 description" icon="checkmark">
            <div class="apartmentCapabilities" padding>
                <form class="app-form">
                    <ion-list *ngFor="let option of structur; let i = index">
                        <h3>{{ option.people }}</h3>
                        <h3>{{ option.bed}}</h3>
                        <h3>{{ option.bath}}</h3>
                        <h3>{{ option.night}}</h3>
                        <ion-item>
                            <ion-icon name="remove-circle" (click)="decrement()"></ion-icon>
                            {{currentNumber}}
                            <ion-icon name="add-circle" (click)="increment()"></ion-icon>
                        </ion-item>
                    </ion-list>
                </form>
            </div>
        </ion-step>

Моя цель - иметь кнопку увеличения приращения foreach h3, которая звучит как

"Сколько людей: - 1 +".

это мой .ts:

private currentNumber = 0;

constructor() {}

private increment() {
    this.currentNumber++;
}

private decrement () {
    if(this.currentNumber>0){
        this.currentNumber--;}
}

Любая помощь приветствуется.Хорошего дня

Answer 1

Попробуйте удалить private из ваших функций.Это должно быть публично, чтобы шаблон имел доступ к вашим функциям.

private currentNumber = 0;

constructor() {}

increment() {
    this.currentNumber++;
}

decrement () {
    if(this.currentNumber>0){
        this.currentNumber--;}
}