Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular. Value from Event on MatSelectionListChange is undefined

I'm trying to get a value of a changed element in a list, but I'm getting always value undefined while the property checked is right.

HTML

<div>
    <mat-selection-list #costUnits
    [(ngModel)]="selectedCostUnits"
    (selectionChange)="onSelectionChange($event)"
    >
        <mat-list-option *ngFor="let label of labels" selected="true">
            {{ label }}
        </mat-list-option>
    </mat-selection-list>
</div>

TS

  onSelectionChange(event: MatSelectionListChange) {
    console.log(event)
  }

For example: I've clicked twice on one element in the list that was checked and got the following outputs.

console.log output

like image 934
uhetz Avatar asked Oct 20 '25 15:10

uhetz


1 Answers

I got it. The value wasn't bound. The right code of the component is it:

<mat-list-option 
  *ngFor="let label of labels" 
  selected="true" 
  [value]="label"
  >
    {{ label }}
</mat-list-option>
like image 173
uhetz Avatar answered Oct 22 '25 04:10

uhetz



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!