Question

我正在寻找一种最佳的方式来清理成角度的图像URL。

在该应用程序中，用户可以提供图像的URL并对其进行预览，预览功能可以调用托管图像的第三方服务器，并以预览形式提供图像。

HTML

<mat-form-field class="heavy-label">
    <input matInput placeholder="Custom Image Url" [ngModel]="blankScreenConfig.image.url"
        (ngModelChange)="setCustomImage($event)" />
    <mat-hint>http://example.com/someImage.jpg</mat-hint>
</mat-form-field>

<div class="background-preview" [ngStyle]="{'background-image': 'url(' + blankScreenConfig.image.src  + ')'}">
    <div class="overlay-text">{{blankScreenConfig.message}}</div>
</div>

TS

 public setCustomImage(value: string): void {
        if (value.match(/\.(jpeg|jpg|gif|png)$/)) {
            const img = new Image({ name: value, url: this.domSanitizer.sanitize(SecurityContext.URL, value) });
            this.blankScreenConfig.image = img;
            this.handleChange();
        }
    }
enter code here

这会传递我们在拦截器中设置的标头吗？在网络标签img中，我可以看到此相应请求的以下内容

显示了临时标题

正确清理<img> URL的角度

0 个答案: