스페이스 바를 통해 앵귤러 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 연산자를 사용하여 수행됩니다. 체크 박스 (true 또는)을 선택하면

checkBox.checked = !checkBox.checked; 

을 !는 반전과 false에 checked을 설정합니다 : 귀하의 경우가 될 것입니다.