私は、チェックボックスを生成し、この角度のコードを使用しています

Question

カンマ区切りの文字列にあるチェックボックスを変換する方法：

selectedEntity:"users1, users2" 

：私はこのようなカンマ区切りの文字列に選択したチェックボックスを変換したい

<div class="col-2" *ngFor="let item of selectedUsers; let idx=index"> 
    <input name="SelectedEntity" value="{{item}}" type="checkbox"> 
</div> 

を

どうすればいいですか？

Answer 1

あなたは既にselectedUsersの配列を持ち、SelectedEntityはブール値の配列を返します。 selectedUsersをループし、チェックボックスの配列がTRUEの場合は、そのインデックスの要素を新しい配列にプッシュします。それが完了したら、Javascriptをジョインする機能を使用してリストを区切ります。

let selectedArray = []; 
for (let index=0; index < selectedUsers.length; index++) { 
    if(SelectedEntity[index] === true) { 
    selectedArray.push(selectedUsers[index]); 
    } 
} 
selectedArray.join(", "); 

Answer 2

HTML：

<div class="col-2" *ngFor="let item of selectedUsers; let idx=index"> 
    <input [(ngModel)]="item.isSelected" type="checkbox"> 
</div> 

コンポーネント：

var result = ""; 
for(let i = 0; i < this.selectedUsers.length; i++) { 
    if(this.selectedUsers[i].isSelected) { 
     if(result != "") { 
      result += ", "; 
     } 
     result += this.selectedUsers[i].name; 
    } 
} 
console.log("selectedEntity:\"" + result + "\""); 

あなたがselectedUsersのうち、オブジェクトのリストを作成したくない場合、あなたは常に別のリストを使用することができます。

Html：

<div class="col-2" *ngFor="let item of selectedUsers; let idx=index"> 
    <input [(ngModel)]="selection[idx]" type="checkbox"> 
</div> 

コンポーネント：

var result = ""; 
for(let i = 0; i < this.selection.length; i++) { 
    if(this.selection[i]) { 
     if(result != "") { 
      result += ", "; 
     } 
     result += this.selectedUsers[i]; 
    } 
} 
console.log("selectedEntity:\"" + result + "\""); 

選択項目に結び付けられているモデルで、このようなを持って表現する必要があるように私はそのアプローチをお勧めしませんけど。