Question

我正在使用Angular开发Web应用程序的前端，我是这项技术的新手。我不知道如何将图像传递给控制器并上传到服务器。

我有html包含图片：

<div class="col-lg-1">
    <label class="btn btn-default" style="margin-top: 35px">
        <i class="fa fa-picture-o" aria-hidden="true"></i>
        <input type="file" style="display: none;" accept="image/*" ng-model="image">   
    </label>
</div>

现在您可以看到图像具有ng-model =“image”，但是在控制器中如果我执行console.log（$ scope.image），我得到了未定义。

我想将图像编码为二进制表示形式，将其与其他属性一起放入JSON并将其上传到服务器。

我该怎么做？

Answer 1

你可以做这样的事情

在你的HTML中

<input type="file" id="file" name="file"/>
<button ng-click="upload()">Upload</button>

在您的控制器中

$scope.upload = function() {
    var f = document.getElementById('file').files[0];
    var r = new FileReader();
    r.onloadend = function(e) {
        var data = e.target.result;
    }
    r.readAsBinaryString(f);
}

将图像上传到服务器Angular JS

1 个答案: