How to overrides icons?

[Khvesiuk]

Expected something like this? But not...

<ng-template svgIconOverrides="arrowBack">
    <mat-icon svgIcon="custom_back"></mat-icon>
  </ng-template>
  <ng-template svgIconOverrides="arrowForward">
    <mat-icon svgIcon="custom_forward"></mat-icon>
  </ng-template>

[gbrlsnchs]

You can use svgIconOverrides to override default icons.

[Khvesiuk]

example?

[Khvesiuk]

okay, here is my working example: app.components.ts

import { MatIconRegistry } from '@angular/material';

constructor(iconRegistry: MatIconRegistry) {
iconRegistry
.addSvgIcon('custom-back', sanitizer.bypassSecurityTrustResourceUrl('../assets/arrow_back.svg'))
.addSvgIcon('custom-forward', sanitizer.bypassSecurityTrustResourceUrl('../assets/arrow_forward.svg'))
}

carousel.component.ts

export class CarouselComponent {
 iconOverrides: SvgIconOverrides = {
    arrowForward: 'custom-forward',
    arrowBack: 'custom-back'
  }
}

carousel.component.html

<mat-carousel  
  [hideIndicators]="false"
  [svgIconOverrides]="iconOverrides">
   <mat-carousel-slide></mat-carousel-slide>
</mat-carousel>

[gbrlsnchs]

Thanks for your patience, @Khvesiuk, as I could not provide an example. I'll try to add your example to the README.