如何在图像源中显示选择的图像

Question

我想在input中显示何时选择文件。为什么不显示？我的代码：

<input type="file" id="logo" name="logo" ng-model="service.logo" required="required">
<img ng-src="{{service.logo}}">

Here is a JSFiddle.

Answer 1

因为在这里你只是接受用户的输入。您需要编写代码来打开文件，读取它并显示在视图上。当您想要在用户浏览并选择图像时显示图像时，您需要触发fileSelect。 另外，看看这个，我想这就是你想要的。 How to read a file in AngularJS?

Answer 2

因为传递给value的{​​{1}}而ng-model file input的唯一内容是文件名

如果您想要预览（上传前），您需要使用FileReader API来读取文件并将其解析为数据网址并将其传递给图像元素