Question

Hai我试图在上传到服务器之前预览图像，并且必须用旧图像替换它。这是我的HTML代码:::::::

 <img class=" thumbnail" data-ng-hide="imageSource==NULL" style="width: 200px; height: 150px;" ng-hide="user.pic" ng-src="{{imageSource}}">

            <img class="hai thumbnail img-responsive" style="width: 200px; height: 150px;" data-ng-show="!imageSource" ng-src="{{user.pic}}">

            <div >
                <span class="btn btn-default btn-file">
                  <span class="fileinput-new upload-button"><span class="glyphicon glyphicon-upload"></span> select image</span>

                <input class="file-upload" ng-model="user.pic" id="FilePhoto"  onchange="angular.element(this).scope().file_changed(this)" type="file" accept="image/*" multiple />
                </span>

                <button type="button" class="btn btn-large btn-primary" ng-click="upload()">upload me
                </button>

我的脚本代码看起来像这样.......

$scope.file_changed = function (element) {
            console.log('llllllll');
            var files = element.files; // FileList object
            // Loop through the FileList and render image files as thumbnails.
            for (var i = 0, photofile; photofile = files[i]; i++) {

                var photofile = element.files[0];
                var reader = new FileReader();
                reader.onload = (function (theFile) {

                    return function (e) {
$('#blah').attr('src', e.target.result);
                        $rootScope.imageSource = e.target.result;
                        console.log('lllllllldddddddddddddd' + JSON.stringify($scope.imageSource));
                        $scope.img=true;

                    };
                })(photofile);
                reader.readAsDataURL(photofile);

            };


        }

用于上传图像的控制器.............

 $scope.upload = function () {

            console.log('imageeeee' + JSON.stringify($rootScope.imageSource));
            var image = {
                pic: $rootScope.imageSource,
            };
            userss.updateimage.update(image, function (result) {
                console.log("sucessfully image uploaded" + JSON.stringify(result));
            });
        }

请帮我解决这个问题。每件事情都很好，但我无法预览图像

如何在上传之前预览图像，并在javascript上传后用旧图像替换它

0 个答案: