bug(MatRipple): MatRipple can not be disabled for child components
- Lingua principale
- TypeScript
- Stelle
- 25k
- Fork
- 6.8k
- Merge medio
- 1g 8h
- PR unite (30g)
- 91
Descrizione
### Is this a regression?
- [ ] Yes, this behavior used to work in the previous version
### The previous version in which this bug was not present was
14
### Description
I once opened this issue (https://github.com/angular/components/issues/26656) and now coming back with another real-world-issue, that can't be solved neatly.
I have a selection with a ripple effect (the boxes in the screenshot) and some, optional, sub-options:

Now every time I hit a suboption the box' ripple effect shows up. Disabling it only on inner click and re-enabling it seams like some nasty timing problem (and even looks like [ripple gets removed on mouse down etc.]).
In my opinion there **really** is a need to be able to disabler the ripple effect for some boxes inside the ripple container. There should either be a directive for disabling it or to make things easy, like I suggested in my previous post, be able to switch from `capture` to `bubbling` so it can be disabled the _vanilla Javascript way_ (`stopPropagation`).
### Reproduction
https://stackblitz.com/edit/angular-phk79p-fyt248
### Expected Behavior
Ripple should not show up on clicking some container's child elements.
### Actual Behavior
Ripple cannot be disabled for some inner clicks.
### Environment
- Angular: 18.0.1
- CDK/Material: 18.0.0
Guida per i contributori
Apri la guida per i contributori
Direzione di ricerca
Riprodurre il comportamento dei clic annidati nello StackBlitz collegato usando Angular 18.0.1 e CDK/Material 18.0.0, quindi esaminare la gestione degli eventi di MatRipple. Determinare come gli elementi figli potrebbero impedire il ripple del contenitore senza soluzioni alternative dipendenti dalla temporizzazione. Il lavoro è completato quando i clic sugli elementi figli designati non attivano il ripple del contenitore, mentre i normali clic sul contenitore continuano ad attivarlo.
Scritto dal modello di indicizzazione a partire dal testo della issue.
Valutazione
- Stack tecnologico
- angular, typescript
- Ambito
- frontend
- Tipo di issue
- Bug
- Difficoltà
- 4/5
- Tempo stimato
- 3-5 giorni
- Stato di attività
- Ferma
- Chiarezza
- Abbastanza chiara
- Idoneità per principianti
- 35/100