I am using Angular 15 and also with it the Material Components. I wanted to use the material checkbox and implement my own function (the click function) where I set the checkItem.start to true/false and where I would expect that the checkbox should be getting checked or unchecked, depending on my flag value. I don't want to use the two-way binding, as it updates my values automatically when checking the checkbox, which I want to change inside in my click function myself and update it.
The problem is my checkbox will always get checked before I even enter the function in my "click" property and even if my flag is getting updated with another value, the component is not getting updated. I also tried to use the ChangeDetectorRef.detectChanges() function for the updating, but unfortunately it is not working.
It's also important to mention that I am using customized provider, which looks like this:
providers: [
{ provide: MAT_CHECKBOX_DEFAULT_OPTIONS, useValue: {} as MatCheckboxDefaultOptions }
]
The HTML for then Angular Component:
<mat-checkbox
[disabled]="isReadOnly(checkItem) || checkItem.finished"
[checked]="checkItem.start"
(click)="doCheck(checkItem, $event)"
</mat-checkbox>
Am I maybe using the wrong component properties?
Aucun commentaire:
Enregistrer un commentaire