需要创建一个pipe

代码如下

import { Pipe, PipeTransform } from '@angular/core';
import {DomSanitizer} from '@angular/platform-browser';
@Pipe({
name: 'trustUrl'
})
export class TrustUrlPipe implements PipeTransform {
constructor(private sanitizer: DomSanitizer) { }
transform(url: any, args?: any): any {
// 允许通过不安全的 url
return this.sanitizer.bypassSecurityTrustResourceUrl(url);
} }

  

2. 在url中使用此管道

<img src="(baseImgSrc) | trustUrl">

  baseImgSrc  是图片的路径

angular2 图片赋值的时候前面自动加 unsafe:xxx 导致图片信息不显示问题的更多相关文章

  1. exml自动加载图片

    常规H5和微信小游戏同样有效 一.exml自动加载图片 有两张图片 图片未放入defatult.res.json的资源组里,未预先加载包含2张图片的资源组,仅仅在default.res.json里有图 ...

  2. BPM配置故事之案例3-参与者与数据自动加载

    这才过了两天,阿海又来了. 阿海:公司决定改进管理方式,以后物资申请的申请人和申请部门要写具体使用人的名字和部门了. 小明:不是要让我改回去吧? 阿海:那太麻烦了,你能不能把申请人改成选择,选好人自动 ...

  3. 速战速决 (5) - PHP: 动态地创建属性和方法, 对象的复制, 对象的比较, 加载指定的文件, 自动加载类文件, 命名空间

    [源码下载] 速战速决 (5) - PHP: 动态地创建属性和方法, 对象的复制, 对象的比较, 加载指定的文件, 自动加载类文件, 命名空间 作者:webabcd 介绍速战速决 之 PHP 动态地创 ...

  4. PHP中类自动加载的方式

    最近在学习composer,发现从接触PHP到现在已经遇到了三种关于PHP中类的自动加载方式,这其中包括PHP自带的类的自动加载方式.PHP的第三方的依赖管理工具composer的加载方式以及PHP的 ...

  5. [JS前端开发] js/jquery控制页面动态加载数据 滑动滚动条自动加载事件

    页面滚动动态加载数据,页面下拉自动加载内容 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样的效果:进入qq空间,向下拉动空 ...

  6. Yii2之类自动加载

    在yii中,程序中需要使用到的类无需事先加载其类文件,在使用的时候才自动定位类文件位置并加载之,这么高效的运行方式得益于yii的类自动加载机制. Yii的类自动加载实际上使用的是PHP的类自动加载,所 ...

  7. DDGScreenShot--iOS 图片裁剪,切圆角,加边框,你还用cornerRadius,还有更高级的用法

    写在前面 我们肯定做过这样的需求,给一个图片切圆角, 当然我们大多采用简单粗暴的方法 myIcon.layer.cornerRadius = 16.5 myIcon.layer.masksToBoun ...

  8. composer 实现自动加载原理

    简介 一般在框架中都会用到composer工具,用它来管理依赖.其中composer有类的自动加载机制,可以加载composer下载的库中的所有的类文件.那么composer的自动加载机制是怎么实现的 ...

  9. Python3从零开始爬取今日头条的新闻【三、滚动到底自动加载】

    Python3从零开始爬取今日头条的新闻[一.开发环境搭建] Python3从零开始爬取今日头条的新闻[二.首页热点新闻抓取] Python3从零开始爬取今日头条的新闻[三.滚动到底自动加载] Pyt ...

随机推荐

  1. Quartus16.1布线优化选择,重编译可能会满足时序

    流程 (1)在默认的优化编译下,时序违例. (2)在assignments中选择setting. (3)根据需求,选择不同的优化方式,目前选择性能优先. (4)可以发现时序满足要求. 以上.

  2. Android Intent 传递数据注意事项

    不要通过 Intent 在 Android 基础组件之间传递大数据(binder transaction缓存为 1MB),可能导致 OOM.

  3. 集合源码分析[3]-ArrayList 源码分析

    历史文章: Collection 源码分析 AbstractList 源码分析 介绍 ArrayList是一个数组队列,相当于动态数组,与Java的数组对比,他的容量可以动态改变. 继承关系 Arra ...

  4. mvn test报错

    1 Scenarios (1 passed) 4 Steps (4 passed) 0m11.846s [INFO] Tests run: 1, Failures: 0, Errors: 0, Ski ...

  5. (八) Usb摄像头描述符解析

    目录 Usb摄像头描述符解析 总结 参考资料 打印设备描述符 打印配置描述符 打印接口联合体描述符 打印接口描述符 打印当前设置的额外描述符 代码解析额外的描述符 打印端点描述符 title: Usb ...

  6. 如何设置Maven代理

    1.公司的网络走的是代理,那么如何设置maven下载jar包时也走代理呢. 根据百度出来的两篇文章 设置了一下,但是还是报错. Plugin org.apache.maven.plugins:mave ...

  7. python 之金玉良言 或许是最后一次给自己系统总结--已结

    jar tvf xxx.jar vim xxx.jar 配置一下 notepad++ F5 cmd /k D:"Program Files (x86)"\python\python ...

  8. 蚂蚁爬杆问题js实现

    运行效果 代码 <!DOCTYPE html> <html> <head> <title>蚂蚁爬杆实验</title> <script ...

  9. 第二章,循环结构,输入输出,clock

    计时 计时函数: clock() 返回目前为止运行的时间 注意要除以常数 CLOCKS_PER_SEC, 才能得到以秒为单位. 头文件 time.h 管道 在windows命令行下执行echo 20| ...

  10. 20155324《网络对抗》Exp1 PC平台逆向破解(5)M

    20155324<网络对抗>Exp1 PC平台逆向破解(5)M 实验目标 本次实践的对象是一个名为~pwn1~的~linux~可执行文件. 该程序正常执行流程是:~main~调用~foo~ ...