Ask Your Question

Revision history [back]

click to hide/show revision 1
initial version

Yes, check-boxes can be positioned to the left in Angular Material's mat-list options by adding the "mat-list-option" class to the list option and using the "mat-list-avatar" directive to place the check-box on the left.

For example, the following code will position the check-box on the left:

<mat-selection-list>
  <mat-list-option class="mat-list-option" *ngFor="let item of items">
    <mat-icon mat-list-icon>person</mat-icon>
    <div mat-list-avatar>
      <mat-checkbox [(ngModel)]="item.selected"></mat-checkbox>
    </div>
    {{ item.name }}
  </mat-list-option>
</mat-selection-list>