Components: mat-select doesn't propagate (change) event to containing div

[kr-pawan]

Bug, feature request, or proposal:

Bug

What is the expected behavior?

mat-select as opposed to usual select does not propagate the onChange event up the hierarchy. If we have a div container for this mat-select then (change) event on the div will not be captured.
Whereas, the mat-select tag itself obviously captures the change event.
Also, form it is contained in updates the class to ng-dirty, but somehow the div is unable to capture the event. The usual select gives the right behavior.

What is the current behavior?

The mat-select change event must be propagated to the containing div as happens in normal select dropdown.

What are the steps to reproduce?

https://stackblitz.com/edit/angular-material2-issue-xdzlo7

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

Even should propagate

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

Angular- 5.2.0
Angular Material 5.2.4
Os- Linux
Typescript- 2.5.3
Browser- Chrome

Is there anything else we should know?

[crisbeto]

This is how Angular event emitters work in general. They won't bubble up the DOM the same way native events do.

[kr-pawan]

You must have got it wrong. This issue doesn't have to do with how Angular event emitters work!
At both the places (change) event is being emitted by Angular, only difference is between the
mat-select and select.
As we know angular material is used for to give your website a different modern look, then why the difference in behavior of emitting the change event?

[crisbeto]

The change event on select is a native DOM event, whereas mat-select doesn't have a change event at all. It has a selectionChange event which is an EventEmitter and which won't bubble up the DOM.

[kr-pawan]

Then this has to be specifically when you use mat-select rather than Angular in general?

[kamalSaiDd]

You need to use (selectionChange) instead of (change). (change) is deprecated from angular 6.0
Solution to this: https://github.com/angular/material2/issues/11786

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}