通过空格键选中并取消选中角度2中的复选框

Question

我是角色2的新手并试图实现一个复选框功能，复选框应该在我按空格键后检查并取消选中。

component.html中的复选框代码 -

<md-checkbox #checkBox (keyup)="handleCheckBoxKeyUp($event,checkBox)" name="" value=""></md-checkbox>

通过我的component.ts中的空格键选择复选框的代码 -

handleKeyUp($event,checkBox: MdCheckBox){
    if ($event.code===32){
    checkBox.checked=true;
    }
}

当我点击空格键时，正在检查复选框，但在空格键的下一击时它不会被取消选中。这应该是连续发生的。非常感谢任何帮助。

另外，我想在多个页面中重用此功能。让我知道如何做到这一点。谢谢。

Answer 1

这是一个非常基本的编程问题。

不是将checked属性设置为true，而是每次空格键被击中时都要反转其值。

这是使用!或逻辑NOT运算符完成的。在你的情况下，它将是：

checkBox.checked = !checkBox.checked;

如果选中了复选框（或true），则!会将其反转并将checked设置为false。