Я пытаюсь добавить значок mat в свой проект из набора svg.
В моем app.module у меня есть следующий код -
import { MatIconModule } from '@angular/material/icon';
imports: [
...
MatIconModule,
...
]
В приложении.component У меня есть
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
})
export class AppComponent {
constructor(iconRegistry: MatIconRegistry, sanitizer: DomSanitizer) {
iconRegistry.addSvgIconSet(
sanitizer.bypassSecurityTrustResourceUrl('../assets/icons/icon-set.svg'));
}
}
И в моем HTML я использую его так:
<mat-icon svgIcon="Setting"></mat-icon>
Когда приложение загружается, появляется значок.Но это отображается так:
Почему изображение отображается не полностью?Я работаю с SVG Icons в первый раз.Они отлично работают со шрифтами - но я пытаюсь переместить avay из шрифтов в svg.
Я попытался сделать css transform: scale (0.7), чтобы изменить его размер, чтобы он соответствовал, в случае, если изображение было слишкомбольшой для контейнера.Но это тоже не сработало.Любая помощь приветствуется.