在Angular 8中,可以通过以下方法保持表格页面中复选框的值:
export class MyComponent implements OnInit {
tableData: any[] = [
{ id: 1, name: 'Item 1', checked: false },
{ id: 2, name: 'Item 2', checked: true },
{ id: 3, name: 'Item 3', checked: false },
];
constructor() { }
ngOnInit() {
}
}
*ngFor
指令来循环渲染表格行,并绑定复选框的值和ngModel
指令。例如:
ID
Name
Checked
{{ item.id }}
{{ item.name }}
console.log
方法来查看复选框的值是否正确保存。例如:export class MyComponent implements OnInit {
tableData: any[] = [
{ id: 1, name: 'Item 1', checked: false },
{ id: 2, name: 'Item 2', checked: true },
{ id: 3, name: 'Item 3', checked: false },
];
constructor() { }
ngOnInit() {
console.log(this.tableData); // 输出初始复选框的值
// 模拟页面更改后的复选框值保存
setTimeout(() => {
console.log(this.tableData); // 输出更改后的复选框的值
}, 5000);
}
}
通过上述方法,可以在Angular 8中保持表格页面中复选框的值,并在需要时获取和使用这些值。