Использовать локальные переменные в событии (click) без двухсторонней привязки

Question

Я считал массив пользовательских объектов с * ngFor. Я хочу удалить объекты с помощью флажка «удалить» и установить кнопку (рядом с каждой строкой в ​​таблице). Как я могу передать состояние флажка функции setUser.

<ion-row class="userList" *ngFor="let user of users">
    <ion-col col-5 class="userName">
        {{user.firstname}} {{user.lastname}}
    </ion-col>
    <ion-col>
        <ion-checkbox></ion-checkbox> <span>Remove</span>
    </ion-col>
    <ion-col>
        <!--How can I read out the value of the checkbox above-->
        <button ion-button color="primary" (click)="setUser(user._id,???)">Set</button>
    </ion-col>
</ion-row>

Answer 1

Попробуйте это.

Установите переменную ссылки на шаблон вашего флажка "userCheckbox" в этом примере.

<ion-checkbox #userCheckbox></ion-checkbox>

Затем передайте эту переменную значения флажка, это будет true / false.

<button ion-button color="primary" (click)="setUser(user._id,userCheckbox.value)">Set</button>

Answer 2

Если вы не хотите, чтобы [(ngModel)] использовался вообще:

Создайте массив скажем checkedUsers (размер, равный числу пользователей) и инициализируйте их как false

<ion-row class="userList" *ngFor="let user of users; let i = index"> // add index)

<ion-checkbox [checked]="checkedUsers[index]"></ion-checkbox> // или [значение]

(click)="setUser(user._id, index)"

setUser(userid, index){
   this.checkedUsers[index] = true;
}

Этот подход не рекомендуется, вы можете продолжитьс Sajeetharan way

Answer 3

Вам необходимо иметь логическую переменную с пользовательским объектом, чтобы связать состояние пользователя.скажи активный.

<ion-checkbox [(ngModel)]="user.Active"></ion-checkbox>

и вы можете передать или использовать переменную Active в вашей функции setUser, тогда

<button ion-button color="primary" (click)="setUser(user._id,user.Active)">Set</button>