我正在尝试取消选择Angular 2中的单选按钮。我尝试了下面的代码,但它没有帮助。
联系我们
<div [formGroup]="myForm">
<mat-radio-group matInput (click)= "resetRadio($event)" formControlName="RdoSel">
<mat-radio-button *ngFor="let RadioOpt of RadioOpts" [value]="RadioOpt .id">{{RadioOpt .value}}</mat-radio-button>
</mat-radio-group>
</div>
*.ts
public RadioOpts= [
{ id: 'Market', value : 'Market'},
{ id: 'Segment', value : 'Segment'}
];
public resetRadio(event: any) {
if(myForm.get('RdoSel').value===event.target.value){
myForm.get('RdoSel').setValue('false');
}
当I console.log(event.target.value)
时,它返回<div>
标记。有人能告诉我如何在Angular 2中取消选择单选按钮吗?
5条答案
按热度按时间tvz2xvvm1#
使用React形式,我们可以使用
这将重置你的无线电为未选中。
qf9go6mv2#
对我来说,它的作用是:
html:
ts:
hpcdzsge3#
要关闭单选按钮,您可以在单选按钮的html属性“checked”上使用绑定,然后在组件中创建一个属性(变量),如“radioStatus:boolean;",如上所述。然后,您可以通过将false或true赋给radioStatus来更改绑定的值。您可以通过事件访问单选按钮的当前值。下面是一些例子。
HTML
在组件-属性中
在组件-视图当前值中
在组件中-从单选按钮中删除检查
rdlzhqv94#
非物质解决方案
您可以使用@ViewChilder如下(我的代码)
和.ts文件中
类
FieldRadioItem
只包含字段id
、label
和checked
。在Angular 11上测试lzfw57am5#
原生解决方案取消选择Angular中的单选按钮:
示例:
它的工作Angular 为8。
参考文献:
https://stackblitz.com/edit/angular-radio-uncheck-all?file=src%2Fapp%2Fapp.component.html