通过在组件中定义一个检查方法，利用 `array.prototype.every()` 判断数组是否所有元素均为 `false`，再将该方法绑定到按钮的 `[disabled]` 属性，即可实现条件禁用。
在 Angular 模板中动态控制按钮的启用/禁用状态是常见需求。当需要依据一个布尔数组（如 studentArray: boolean[]）的所有值是否全部为 false 来决定按钮是否禁用时，推荐采用纯逻辑封装 + 模板绑定的方式，既保持模板简洁，又确保可读性与可维护性。
✅ 推荐实现方式（组件 TS 文件）
export class MarksheetComponent {
studentArray: boolean[] = [false, false, false]; // 示例数据
// 检查数组是否所有元素严格等于 false
areAllStudentsUnchecked(): boolean {
return this.studentArray.length > 0
? this.studentArray.every(val => val === false)
: true; // 空数组视为“全 false”，按需调整逻辑
}
generateMarksheet(): void {
// 生成成绩单逻辑
}
}? 说明： 使用 every(val => val === false) 进行严格相等判断，避免 0、''、null 等 falsy 值意外干扰（因 studentArray 类型明确为 boolean[]，此写法更语义清晰）； 添加 length > 0 判断可防止空数组导致 every() 返回 true（every 对空数组默认返回 true），若业务要求“空数组=不可操作”，则保留 true；反之可改为 return this.studentArray.length === 0 || ...。
✅ 模板中绑定禁用状态
<button class="btn btn-success" [disabled]="areAllStudentsUnchecked()" (click)="generateMarksheet()"> Generate Marksheet </button>
⚠️ 注意：原问题中写的是 click="..."，正确写法应为 (click)="..."（事件绑定语法），否则无法触发。
? 替代方案（不推荐用于复杂逻辑）
你也可以在模板中内联表达式（仅限简单场景）：
[disabled]="studentArray.length > 0 ? !studentArray.some(v => v) : true"
但这种方式缺乏可测试性、难以复用，且在变更逻辑（如增加空数组处理）时易出错，不建议在生产环境中使用。
✅ 最佳实践总结
- ✅ 将判断逻辑封装为组件方法，提升可读性与可测试性；
- ✅ 使用 === false 而非 !val，确保类型安全与意图明确；
- ✅ 显式处理边界情况（如空数组），避免隐式行为引发 Bug；
- ✅ 在模板中仅做声明式绑定，不嵌入复杂逻辑；
- ✅ 配合 OnPush 策略或 ChangeDetectionStrategy.OnPush 时，注意 studentArray 更新后需触发变更检测（如通过 this.changeDetectorRef.markForCheck() 或使用 Observable + async 管道）。
这样，按钮将智能响应数组状态变化——仅当至少一个学生被选中（即存在 true）时才启用，真正实现“全未选中则禁用”的交互目标。
