Question

我知道这一点：

<input type="text" #inp>
<button type="button" (click)="onClick(inp.value)">Click</button>

因此，无需使用ngModel指令即可获取输入到文本框中的值。

是否有任何类似的方法可以使用单选按钮而无需使用ngModel？

<input type="radio" value="selected" name="viewType">Selected
<input type="radio" value="unselected" name="viewType">Unselected
<input type="radio" value="both" name="viewType">Both

在这些单选按钮下面，我有一个刷新按钮，如下所示：

<button (click)="refreshView()">Refresh</button>

这些html输入元素不是任何表单标签的一部分。我想要的是使用参数-选定的单选按钮值进行“ refreshView”函数调用。

这可能吗？

Answer 1

如果只有几个单选按钮，则可以使用以下语法。借助嵌套的conditional operators，它获取与选中的单选按钮关联的值。

<input #rad1 type="radio" value="selected" name="viewType" >Selected
<input #rad2 type="radio" value="unselected" name="viewType" >Unselected
<input #rad3 type="radio" value="both" name="viewType" >Both

<button (click)="refreshView(rad1.checked ? rad1.value : rad2.checked ? rad2.value : rad3.checked ? rad3.value : null)">Refresh</button>

有关演示，请参见this stackblitz。

单选按钮的角度模板参考变量

1 个答案: