在Angular 6中,可以通过以下步骤将现有的逗号分隔输入转换为多个复选框:
以下是一个示例代码:
// 在组件的类中定义变量和方法
export class MyComponent implements OnInit {
inputValues: string;
checkboxValues: string[];
ngOnInit() {
this.convertInputToCheckboxes();
}
convertInputToCheckboxes() {
this.checkboxValues = this.inputValues.split(',');
}
}
// 在组件的模板中使用ngFor循环遍历复选框
<div *ngFor="let value of checkboxValues">
<input type="checkbox" [value]="value" [(ngModel)]="value"> {{ value }}
</div>
在上述示例中,inputValues变量用于存储逗号分隔的输入值。convertInputToCheckboxes()方法将输入值转换为字符串数组,并将结果存储在checkboxValues变量中。模板中使用ngFor指令循环遍历checkboxValues数组,并为每个值创建一个复选框。通过双向数据绑定,复选框的选中状态与数组中的对应值绑定。
领取专属 10元无门槛券
手把手带您无忧上云