首页 > 解决方案 > 在 mat-icon 中设置 SVG 的 preserveAspectRatio

问题描述

我有一个带有 SVG 图像的 mat-icon:

<mat-icon [svgIcon]="getIcon()"></mat-icon>

生成的 html 看起来像这样:

<mat-icon _ngcontent-plf-c14="" class="mat-icon notranslate mat-icon-no-color" role="img" aria-hidden="true" ng-reflect-svg-icon="some-icon">
    <svg width="100%" height="100%" viewBox="0 0 288 78" fill="none" xmlns="http://www.w3.org/2000/svg" fit="" focusable="false" preserveAspectRatio="xMidYMid meet">
        <path d="M252 1H3L37 38.5L3 76.5H252L286.5 38.5L252 1Z" fill="#3ED8C3" stroke="#1D4477" stroke-width="2"></path>
    </svg>
</mat-icon>

除了 preserveAspectRatio 位之外,所有这些都很好。Angular 总是插入

preserveAspectRatio="xMidYMid meet"

进入 SVG 但我想要

preserveAspectRatio="none"

我不知道如何得到它。

HTML 或 CSS 是否有某种方法可以更改 mat-icon 内生成的 SVG 的 preserveAspectRatio 属性?

标签: cssangular

解决方案


推荐阅读