I need assistance with setting a date using radio buttons. I encountered an error when I tried to change the value while the component was loading.
html.component.html
...
<div>
<input type="radio" name="period" [checked]="asPeroidBtn === '1W'" (click)="setDate( '1W' )"/><span>1 Week</span>
<input type="radio" name="period" [checked]="asPeroidBtn === '1M'" (click)="setDate( '1M' )"/><span>1 Month</span>
<input type="radio" name="period" [checked]="asPeroidBtn === '3M'" (click)="setDate( '3M' )"/><span>3 Months</span>
<input type="radio" name="period" [checked]="asPeroidBtn === '6M'" (click)="setDate( '6M' )"/><span>6 Months</span>
</div>
...
html.component.ts
...
asPeroidBtn = '1W';
...
ngAfterViewInit() {
this.setDate('1M');
}
setDate(period){
this.asPeroidBtn = period;
}
...
Upon implementation, I encountered the following error:
ERROR Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value for 'checked': 'true'. Current value: 'false'.
at throwErrorIfNoChangesMode (core.js:5625)
at bindingUpdated (core.js:13962)
...
I would appreciate guidance on resolving this issue.