Abdallah
Abdallah

Reputation: 197

How can I stopPropagation when angular mat-select option selected?

I want to stopPropagation when angular material select changes, Seems like the returned $event doesn't have the stopPropagation()?

<mat-select (selectionChange)="handleSelectionChange($event)">
</mat-select>

Upvotes: 5

Views: 4648

Answers (2)

Davious
Davious

Reputation: 1873

Wrap the mat-select with a div. That can be used to capture and stop the same click event that triggers the mat-select selection.

<div (click)="prevent($event)">
  <mat-select (selectionChange)="handleSelectionChange()">
  </mat-select>
<div>

prevent($event) {
  $event.preventDefault();
  $event.stopPropagation();
}

Upvotes: 2

joy08
joy08

Reputation: 9662

Try using the (valueChange) event. Then use $event.stopPropagation() inside the change handler

<mat-select (valueChange)="handleSelectionChange($event)">
</mat-select>

Upvotes: 0

Related Questions