Question

我使用ng-src清除ng-click（输入文件）时遇到问题。我想用angular来解决这个问题。我尝试使用angular.element.val('')但这对我来说不是一个好方法。你知道另一种方式吗？

controller.js

 app.imagePreview = false;

$scope.thumbnail = {
    dataUrl: null
};
$scope.fileReaderSupported = window.FileReader != null;
$scope.photoChanged = function(files){
    if (files != null) {
        var file = files[0];
        if ($scope.fileReaderSupported && file.type.indexOf('image') > -1) {
            $timeout(function() {
                var fileReader = new FileReader();
                fileReader.readAsDataURL(file);
                fileReader.onload = function(e) {
                    $timeout(function(){                            
                        $scope.thumbnail.dataUrl = e.target.result;
                        app.imagePreview = true;
                    });
                }
            });
        }
    }
};
app.clearImage = function(){
    $scope.thumbnail = {
        dataUrl: null
    };  
}

的index.html

<div class="form-group">
<div class="input-group">
    <div class="input-group-addon">
        <i class="fa fa-picture-o"></i>
    </div>
    <input type="text" class="form-control" readonly>
    <span class="input-group-btn">        
        <span class="btn btn-default btn-file add-img-upload">
            <a id="clearPreview" type="button" ng-click="product.clearImage()">
                <span class="glyphicon glyphicon-remove"></span> Usuń
            </a>
        </span>
        <span class="btn btn-default btn-file add-img-upload"><span class="glyphicon glyphicon-folder-open"></span> Wybierz 
            <input type="file" name="file" id="imgInp" onchange="angular.element(this).scope().photoChanged(this.files)" ng-model="files">
        </span>
    </span>
</div>
<img ng-if="product.imagePreview" ng-src="{{ thumbnail.dataUrl }}" id='img-upload'/>
</div>

Answer 1

在您的控制器中，您已将方法命名为app.clearImage，在您的html中，您正在调用product.clearImage。重命名其中一个，以便它们匹配，它应该工作。

我相信你真的只想让clearImage成为你控制器的一种方法。删除“产品”。在你的html和chanding“app”前面。在你的控制器前面的“$ scope”。也应该工作。

你的HTML中的

：

并在您的控制器中：

$scope.clearImage = function(){
    $scope.thumbnail = {
        dataUrl: null
    };  
}

使用ng-click清除ng-src

1 个答案: