如何选中框以检查角度值是否为真

时间:2019-07-06 10:12:08

标签: angular

我的角度应用程序我想在循环值是true或false时选中此复选框,我该怎么做?我尝试了很多次但没有成功,我是一个新的角度用户,可以预先感谢任何人。

预期结果

http://prntscr.com/obcgic

这是我的答复

http://prntscr.com/obcl9l

这是我的html代码

<div class="form-group">
    <label class="control-label">Service Type</label>
         <div class="fancy-checkbox" *ngFor="let sercs of service;let i=index">
            <label>
                <input #vt="ngModel" name="types[{{sercs._id}}]" id="{{sercs._id}}" [(ngModel)]="serviceids1[sercs._id]" type="checkbox" [value]="sercs._id">
                <span>{{sercs.service}}</span>
            </label>
            <label class="float-right">
                <input *ngIf="equipmentEdit.services.is_compulsory == false" checked  type="checkbox" #stype="ngModel" name="is_compulsory[{{sercs._id}}]" id="{{sercs._id}}" [(ngModel)]="serviceids2[sercs._id]">
                <span>Is Compulsory</span>
         </label>
    </div>
</div>

这是ts文件中的编辑功能

 editRecord(id: any) {

        this.equipmentService.editEquipments(id).then(res => {
            this.equipmentEdit = res.data;
        });
    }

2 个答案:

答案 0 :(得分:0)

使用 [选中] =“表达式”。 如果Expression / value为true,则将其选中,否则未选中。

<input #vt="ngModel" name="types[{{sercs._id}}]" id="{{sercs._id}}" 
    [checked]="sercs.is_compulsory" [(ngModel)]="serviceids1[sercs._id]" type="checkbox" [value]="sercs._id"> 

答案 1 :(得分:0)

尝试一下,希望它能工作

          <label>
            <input #vt="ngModel" name="types[{{sercs._id-{{i}}}}]" id="{{sercs._id-{{i}}}}" [checked]="serviceids1[sercs._id]" type="checkbox" (change)="serviceids1[sercs._id] = $event.target.checked?true:false;">
            <span>{{sercs.service}}</span>
        </label>

或者您可以非常简单地完成

<label>
            <input #vt="ngModel" name="sercs.is_compulsory-{{i}}"  [checked]="sercs.is_compulsory" type="checkbox" (change)="sercs.is_compulsory = $event.target.checked?true:false;">
            <span>{{sercs.service}}</span>
        </label>