Angular6 input file 上传图片显示缩略图

<h1>上传图片显示缩略图</h1><img height="100px" width="100px" [src]="_d.bypassSecurityTrustUrl(imgsrc)"><input type="file" (change)="fileChange($event)">

import { Component } from '@angular/core';import { DomSanitizer } from '@angular/platform-browser';@Component({selector: 'my-app',templateUrl: './ponent.html',styleUrls: [ './ponent.css' ]})export class AppComponent {imgsrc = '/assets/client/components/SideMenu/blitz_logo-11cebad97cad4b50bc955cf72f532d1b.png';constructor(public _d: DomSanitizer // 图片路径转换使用，使用见HMTL文件) { }fileChange(e) {const file = e.srcElement.files[0]; // 获取图片这里只操作一张图片this.imgsrc = window.URL.createObjectURL(file); // 获取上传的图片临时路径}}

作者：YLPeach

链接：/p/e9082884d80b

来源：简书

简书著作权归作者所有，任何形式的转载都请联系作者获得授权并注明出处。