fix(button-toggle): emit change event when button is clicked (#11886)

Author: tinayuangao

src/lib/button-toggle/button-toggle.spec.ts

@@ -345,9 +345,8 @@ describe('MatButtonToggle without forms', () => {
       fixture.detectChanges();
       tick();
 
-      // The default browser behavior is to not emit a change event, when the value was set
-      // to false. That's because the current input type is set to `radio`
-      expect(changeSpy).toHaveBeenCalledTimes(1);
+      // Always emit change event when button toggle is clicked
+      expect(changeSpy).toHaveBeenCalledTimes(2);
     }));
 
     it('should emit a change event from the button toggle group', fakeAsync(() => {

src/lib/button-toggle/button-toggle.ts

@@ -447,10 +447,9 @@ export class MatButtonToggle extends _MatButtonToggleMixinBase implements OnInit
         this.buttonToggleGroup._syncButtonToggle(this, this._checked, true);
         this.buttonToggleGroup._onTouched();
       }
-
-      // Emit a change event when the native button does.
-      this.change.emit(new MatButtonToggleChange(this, this.value));
     }
+    // Emit a change event when it's the single selector
+    this.change.emit(new MatButtonToggleChange(this, this.value));
   }
 
   /**