fix(material): rely on checkbox change input instead of formly attr (#…

…2356) fix #2353
ngx-formly · Jul 11, 2020 · eaa66ed · eaa66ed
1 parent ffad0db
commit eaa66ed
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 3 deletions.
diff --git a/src/material/checkbox/src/checkbox.type.ts b/src/material/checkbox/src/checkbox.type.ts
@@ -1,6 +1,6 @@
 import { Component, ViewChild } from '@angular/core';
 import { FieldType } from '@ngx-formly/material/form-field';
-import { MatCheckbox } from '@angular/material/checkbox';
+import { MatCheckbox, MatCheckboxChange } from '@angular/material/checkbox';
 
 @Component({
   selector: 'formly-field-mat-checkbox',
@@ -11,6 +11,7 @@ import { MatCheckbox } from '@angular/material/checkbox';
       [required]="to.required"
       [formlyAttributes]="field"
       [tabindex]="to.tabindex"
+      (change)="change($event)"
       [indeterminate]="to.indeterminate && formControl.value === null"
       [color]="to.color"
       [labelPosition]="to.align || to.labelPosition">
@@ -36,4 +37,10 @@ export class FormlyFieldCheckbox extends FieldType {
     this.checkbox.focus();
     super.onContainerClick(event);
   }
+
+  change($event: MatCheckboxChange) {
+    if (this.to.change) {
+      this.to.change(this.field, $event);
+    }
+  }
 }
diff --git a/src/material/radio/src/radio.type.ts b/src/material/radio/src/radio.type.ts
@@ -1,6 +1,6 @@
 import { Component, ViewChild, AfterViewInit, OnDestroy } from '@angular/core';
 import { FieldType } from '@ngx-formly/material/form-field';
-import { MatRadioGroup } from '@angular/material/radio';
+import { MatRadioGroup, MatRadioChange } from '@angular/material/radio';
 import { ɵwrapProperty as wrapProperty } from '@ngx-formly/core';
 
 @Component({
@@ -10,7 +10,8 @@ import { ɵwrapProperty as wrapProperty } from '@ngx-formly/core';
       [formControl]="formControl"
       [formlyAttributes]="field"
       [required]="to.required"
-      [tabindex]="to.tabindex">
+      [tabindex]="to.tabindex"
+      (change)="change($event)">
       <mat-radio-button *ngFor="let option of to.options | formlySelectOptions:field | async; let i = index;"
         [id]="id + '_' + i"
         [color]="to.color"
@@ -52,4 +53,10 @@ export class FormlyFieldRadio extends FieldType implements AfterViewInit, OnDest
   ngOnDestroy() {
     this.focusObserver && this.focusObserver();
   }
+
+  change($event: MatRadioChange) {
+    if (this.to.change) {
+      this.to.change(this.field, $event);
+    }
+  }
 }