angular2で純粋なJavaScriptを使用して、複数のオプションを選択/選択したために別の方法。ここで私たちが.htmlのファイルに記述する必要がありますコードは次のとおりです。
<div class="multiselect">
<div class="selectBox(click)="showCheckboxes('checkboxes1',batchEvent); batchEvent=!batchEvent">
<select class="form-control">
<option selected disabled>Select Batch</option>
</select>
<div class="overSelect"></div>
</div>
<div id="checkboxes1" style="display: none;">
<div *ngFor="#batch of batch_array">
<input type="checkbox" [value]="batch.id" id="E{{batch.id}}" (click)="batchSelectedEevent('E'+batch.id,batch.id)" /> {{batch.batch_name}}
</div>
</div>
</div>
CSSはここにある: - .TSファイルまたは我々が記述する必要がコンストラクタで
.multiselect {
width: 200px;
}
.selectBox {
position: relative;
}
.selectBox select {
width: 100%;
font-weight: bold;
}
.overSelect {
position: absolute;
left: 0; right: 0; top: 0; bottom: 0;
}
:
batchEvent:boolean= false;
// Function for Multiple Select options checkbox area //
showCheckboxes(ids, flag) {
let checkboxes = document.getElementById(ids);
if (!flag) {
checkboxes.style.display = "block";
} else {
checkboxes.style.display = "none";
}
}
batchSelectedholiday(id, value) {
// console.log(id, value);
if ((<HTMLInputElement>document.getElementById(id)).checked == true) {
this.batchHoliday_array.push(value);
}
else if ((<HTMLInputElement>document.getElementById(id)).checked == false) {
let indexx = this.batchHoliday_array.indexOf(value);
this.batchHoliday_array.splice(indexx, 1);
}
console.log(this.batchHoliday_array, "batchHoliday_array");
}
https://github.com/angular/angular/issues/4427 –
を参照してください。angle2コードのコードが必要な場合は、これを私のangular2コードで使用しています(http://stackoverflow.com/a/27547021/5043867)。投稿してください –
明らかにまだ実装されていません。 https://github.com/angular/angular/issues/6830 –