如何将索引值作为div的id?

时间:2017-03-14 21:00:07

标签: angular typescript

目前我正在使用Angular 2.0。我有一个名为addExtra的数组:number [] = [0,1,2,3];

我的HTML代码如下:

<div *ngFor="let val of addExtra">
    <div class="row">
        <div style="margin-left:15px;">
            <button class="btn btn-danger btn-delete"
            (click)='delete(val)'>
                <i class="fa fa-times" aria-hidden="true"></i>
            </button>
            <label for="isCheckBox">Draw</label>
            <input id="isCheckBox" id=val type="checkbox" class="setCheckbox" (change)="isChecked($event)" style="vertical-align: text-bottom;" />
        </div>
    </div>
</div>

如何将val表示0,1,2,3作为id的复选框。

3 个答案:

答案 0 :(得分:0)

<input id="{{val}}" type="checkbox" class="setCheckbox" (change)="isChecked($event)" style="vertical-align: text-bottom;" />

答案 1 :(得分:0)

<div *ngFor="let val of addExtra; let i = index;">
        <div class="row">
            <div style="margin-left:15px;">
                <button class="btn btn-danger btn-delete"
                (click)='delete(val)'>
                    <i class="fa fa-times" aria-hidden="true"></i>
                </button>
                <label for="isCheckBox">Draw</label>
                <input id="isCheckBox" id={{i}} type="checkbox" class="setCheckbox" (change)="isChecked($event)" style="vertical-align: text-bottom;" />
            </div>
        </div>
    </div>

答案 2 :(得分:0)

html标签不能包含2个ID。

<input id={{val}} type="checkbox" class="setCheckbox" (change)="isChecked($event)" style="vertical-align: text-bottom;" />