Skip to content

Commit f178f20

Browse files
crisbetommalerba
authored andcommitted
fix(material-experimental/checkbox): model value not updated through toggle method (#17229)
Along the same lines as #11902. When the value of an experimental checkbox is changed through the `toggle` method it wasn't being propagated to the `ControlValueAccessor`.
1 parent 9586b5c commit f178f20

File tree

2 files changed

+12
-0
lines changed

2 files changed

+12
-0
lines changed

src/material-experimental/mdc-checkbox/checkbox.spec.ts

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -852,6 +852,17 @@ describe('MatCheckbox', () => {
852852
expect(checkboxInstance.checked).toBe(false);
853853
expect(ngModel.valid).toBe(false);
854854
}));
855+
856+
it('should update the ngModel value when using the `toggle` method', fakeAsync(() => {
857+
const checkbox = fixture.debugElement.query(By.directive(MatCheckbox)).componentInstance;
858+
859+
expect(fixture.componentInstance.isGood).toBe(false);
860+
861+
checkbox.toggle();
862+
fixture.detectChanges();
863+
864+
expect(fixture.componentInstance.isGood).toBe(true);
865+
}));
855866
});
856867

857868
describe('with name attribute', () => {

src/material-experimental/mdc-checkbox/checkbox.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -285,6 +285,7 @@ export class MatCheckbox implements AfterViewInit, OnDestroy, ControlValueAccess
285285
/** Toggles the `checked` state of the checkbox. */
286286
toggle() {
287287
this.checked = !this.checked;
288+
this._cvaOnChange(this.checked);
288289
}
289290

290291
/** Handles blur events on the native input. */

0 commit comments

Comments
 (0)