I need to create a shared component to select/deselect all elements of a mat-select because I have an app that use it a lot of times and implement the same piece of work frequently is not an option.
I've been reading many options, like this question, and I decide to create a component as one of the answers propose (look at https://stackblitz.com/edit/angular-select-all-option)
The problem is that with angular v10 it doesn't seems to work. If I click on the Select All button it doens't work, but If I click on some op the options and then I click on Select All it works, but it doesn't work as expected. The code is here:
https://stackblitz.com/edit/select-all-option
The main difference between projects is Ivy compiler. Without Ivy, it works.
Is it possible to achieve this with Ivy compiler? Thanks in advance
It has something to do with how Ivy handles listeners inheritance. _selectViaInteraction is already called within MatOption component because it also contains click host listener.
Try remove this._selectViaInteraction(); in select-all-option.component.ts at 23 line.