업로드하기 전에 그림보기

Question

ng2fileupload를 사용하여 서버에 그림을 업로드하고 코드가 제대로 작동하고 이미지가 업로드되고 있지만 코드를 업로드하기 위해 서버로 보내기 전에 이미지를 표시하고 싶습니다. 아래에 표시됩니다

<img src="" > 

    <input type="file" placeholder="Upload file" ng2FileSelect [uploader]="uploader"> 
    <button class="btn btn-success btn-s" role="submit" (click)="uploader.uploadAll()" [disabled]="passwordForm.valid"> 
     Update 
    </button> 

이미지의 경로를 가져올 수 없어서 img 태그의 src로 보낼 수 없습니다. 어떤 도움을 주셔서 감사합니다.

Answer 1

다음은 원하는 작업을 수행하는 방법을 보여주는 기사 링크입니다. 단지 Angular를 사용하지 않습니다. https://scotch.io/tutorials/use-the-html5-file-api-to-work-with-files-locally-in-the-browser.

기본적으로 파일 api를 사용하여 파일을 데이터 URL로 변환하고 "src"를 해당 URL로 설정해야합니다.