Angular4中SVG图像的自定义高度和宽度

Question

我正在访问一个API，其中在json对象中对图像字符串进行消毒后得到svg图像字符串

this.apiService.receiveImageAsNonJSON("http://localhost:8080/icreate/getViewImagesBySubCategory", subCatName).subscribe(viewImageDataSet => {
        this.masterImageList = viewImageDataSet;

        var masterImageListLength = this.masterImageList.length;          
        // Calculate number columns , number of rows is fixed at 7
        let colCount = Math.ceil(masterImageListLength / 7);

        for (var index = 0; index < masterImageListLength; index++) {
            // Sanitize image string
            this.masterImageList[index] = this.sanitizer.bypassSecurityTrustHtml(this.masterImageList[index] as string);            
        });

现在，我通过使用[outerHTML]属性以html显示图像。 我正在获取svg的实际大小，但是我想要我的自定义大小。 如何解决它。 任何人都请发光。 在此先感谢您-Midde

在这里，我附上了屏幕截图，并在蓝色圆圈中标记了要自定义的高度和宽度。 输出屏幕截图

Answer 1

它很丑陋，但是您可以尝试使用NgStyle指令（ https://angular.io/api/common/NgStyle ）

您可以尝试以下代码：

组件.ts

            sizeOuter():string{
            var resizeComment:number;
            resizeComment=window.innerWidth-45/10;
            return resizeComment + 'px';
        }
        heightOuter():string{
            var resizeComment:number;
             resizeComment=window.innerHeight-45/10;
            return resizeComment + 'px';
        }
html:       

<div [ngStyle]="{'width': sizeOuter(),'height':heightOuter()}" [outerHTML]="image.thumbNailImage">i j</div> </div> 

最诚挚的问候，