在Angular 2中绑定收音机到[checked]

Question

我正在移植一些代码，其中单选按钮状态绑定到布尔值并被手动管理。我不想重写代码来管理共享字符串值（通过ngModel），只是想将一个布尔值绑定到“checked”属性并控制我的代码中的选中状态。有时候，我需要拒绝选择，并在点击后取消选中广播框。

编程取消选中一个单选按钮，工作正常使用常规的醇”的Javascript（plunker）：

<input type="radio" id="radioButton" onclick="uncheckRadioButton()"> 
<script> 
    function uncheckRadioButton() { 
    document.getElementById("radioButton").checked = false; 
    } 
</script> 

这将导致无法进行检查单选按钮。

但在角2简单的布尔结合[checked]不起作用（plunker）：

<input type="radio" [checked]="radioChecked" (click)="onRadioClicked()"> 

不要紧什么价值“radioChecked”已经（在这里它是硬编码为false）;如果你点击单选按钮，它会被检查。

我在这里做错了什么？

Answer 1

您可以模板变量添加到您的无线输入元素，让你可以在你的组件对它的引用，并更改值：

<input type="radio" #myRadio (click)="onRadioClicked()"> 

然后在你的组件，你可以改变它的值：

onRadioClicked(myRadio: any) { 
    myRadio.checked = false; 
} 

这里的工作Plunker。出于某种原因，使用属性绑定无法更改无线电输入的值，我不知道为什么。