复选框值未在复选框单击时被选中答案

【问题标题】：checkbox value is not getting select on checkbox click复选框值未在复选框单击时被选中
【发布时间】：2019-10-12 19:17:30
【问题描述】：

我正在绑定复选框值，但是当我单击复选框时，该值没有得到反映

<div *ngFor="let list of concessionsApplicable?.data; let i=index">
                                <label class="ml-0 mr-0 mt-1 c-checkbox-container" style="font-size: 16px">
                                    <label class="m-0" style="font-size: 14px">{{list?.name}}</label>
                                    <input 
                                           [(ngModel)]="list.isChecked"
                                           [ngModelOptions]="{standalone: true}" 
                                           name="isChecked"
                                           type="checkbox" 
                                           (click)="onApplyConcessions()" 
                                           value="true">
                                    <span class="checkmark"></span>
                                </label>
</div>


onApplyConcessions() {
        if (!!this.concessionsApplicable.data && !!this.concessionsApplicable.isConcessionApplied) {
            this.isNoConcessionReasonReq = false;
            const concessionResArr = [];
            for (let i = 0; i < this.concessionsApplicable.data.length; i++) {

                if (!!this.concessionsApplicable.data[i].isChecked && this.concessionsApplicable.data[i].isChecked === true) {
                    concessionResArr.push(this.concessionsApplicable.data[i].id);
                }
            }
            if (concessionResArr.length === 0) {
                this.alertService.showWarningAlert('At least Select 1 concession before proceeding forward');
                return false;
            }
            this.quoteConcessions = {
                'concessionApplied': 'yes',
                'concessions': concessionResArr
            };
        }
        this.applyConcession.emit(this.quoteConcessions);
    }

在 'concessionApplicable' 数组中，我没有得到键 'isChecked'，所以在这种情况下，当我比较它显示未定义的值时。

【问题讨论】：

标签： angular

【解决方案1】：

尝试使用change()事件

<div *ngFor="let list of concessionsApplicable?.data; let i=index">
    <label class="ml-0 mr-0 mt-1 c-checkbox-container" style="font-size: 16px">
        <label class="m-0" style="font-size: 14px">{{list?.name}}</label>
        <input [(ngModel)]="list.isChecked" [ngModelOptions]="{standalone: true}" name="isChecked" type="checkbox"
            (change)="onApplyConcessions()" value="true">
        <span class="checkmark"></span>
    </label>
</div>

【讨论】：