MdCheckbox does not pass a change event to change handler

Bug, feature request, or proposal:

Bug

What is the expected behavior?

The component should return a change event like any regular HTML input element does, too. Interestingly, MdInput does return a regular change event.

What is the current behavior?

When binding an event handler via the (change)=“doSomethingOnChange($event)” notation, the MdCheckbox component does not return a DOM change event when checked/unchecked but a custom angular event, which does not bubble like a change event should.

What are the steps to reproduce?

Simply register a change event handler on an <md-checkbox> and log the event.

http://plnkr.co/edit/4KRXLDmbHU2pO7RvBiaw?p=preview

What is the use-case or motivation for changing an existing behavior?

The event should bubble just like a regular HTML checkbox’s events bubble so that container elements can catch their events.

Which versions of Angular, Material, OS, browsers are affected?

I tried both 2.0.2 and 2.3.0

Is there anything else we should know?

A fix would be fantastic. We all appreciate your team’s great work!

[luminousPearl]

I used both click and change event on mat-checkbox, click for passing the event to stop propagation. The below code worked for me.

<mat-checkbox (change)=“handleProductClick(product)” [checked]=“product.selected” (click)=“$event.stopPropagation()” [id]=“product.id”></mat-checkbox>

[vidhema]

Here is nice solution via jquery -

`$(‘md-checkbox.toggle-vis’).on( ‘click’, function (e) {

    console.log($(this).find('.mat-checkbox-input').is(":checked"));

});`

just install jquery with npm and put below line in component - `import * as jQuery from ‘jquery’;