删除dropzone中以前选择的图像

Question

我在模板上使用带有表格的dropzone。我有一个按钮是'添加滑块'当我点击那个按钮模态打开时。在那个模态中，我在dropzone上附加了图像，然后点击取消按钮。当我再次单击“添加滑块”按钮时，它会在dropzone中显示先前选定的图像。我想删除以前选择的图像。

Html代码

<modal title="Manage HomeSlider" modaltype="modal-primary" visible="IsFormVisible">
            <form name="frmHomeSlider" method="post" class="form-horizontal bv-form" novalidate="novalidate" ng-submit="frmHomeSlider.$valid && fnSaveHomeSlider()">
                <modal-body>
                    <input type="hidden" class="form-control" name="ID" ng-model="HomeSlider.ID" />
                    <div class="form-group">
                        <label class="col-lg-3 control-label">Upload Slider Photo</label>
                        <div class="col-lg-9">
                            <div class="dropzone profileImage" customdropzone="dropzoneConfig">
                                <div class="dz-default dz-message">
                                    <div ng-show="HomeSlider.FullPathPhoto==''">
                                        <span>Upload photo here</span>
                                    </div>
                                    <img src="{{HomeSlider.FullPathPhoto}}" required />
                                </div>
                            </div>
                            <input type="hidden" name="Photo" ng-model="HomeSlider.HomeSliderPhoto" required />
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-lg-3 control-label">Image Name</label>
                        <div class="col-lg-9">
                            <input type="text" class="form-control input-sm" name="ImageName" ng-model="HomeSlider.ImageName" placeholder="Enter Image Name" required />
                        </div>
                    </div>
     </modal-body>
                <modal-footer>
                    <button type="submit" class="btn btn-blue" ng-disabled="frmHomeSlider.$invalid">Submit</button>
                    <button type="reset" class="btn btn-default" ng-click="fnShowHomeSliderForm(false)">Cancel</button>
                </modal-footer>
            </form>
        </modal>

Js Code

$scope.dropzoneConfig = {
        'options': { // passed into the Dropzone constructor
            'url': ContentService.UploadHomeSliderPhoto,
            'addRemoveLinks': true,
            'acceptedFiles': 'image/*',
            'uploadMultiple': false,
            'maxFiles': 1,
            'dictDefaultMessage': 'Upload your photo here',
            'init': function () {
                this.on('success', function (file, response) {
                    $scope.HomeSlider.HomeSliderPhoto = response.FileNames[0];
                });
                this.on('thumbnail', function (file) {
                    if (file.width < 1800 || file.height < 1200 || file.width > 1800 || file.height > 1200) {
                        file.rejectDimensions();
                    }
                    else {
                        file.acceptDimensions();
                    }
                });
            },
            'accept': function (file, done) {
                file.acceptDimensions = done;
                file.rejectDimensions = function () {
                    done("The image must be at least 1800 x 1200px");
                };
            }

        },
        'eventHandlers': {
            'sending': function (file, xhr, formData) {
            },
            'success': function (file, response) {
                $scope.HomeSlider.HomeSliderPhoto = response.FileNames[0];
            },
            'error': function () {
                $rootScope.Common.notifyDanger("Error accure while upload photo.")
            }
        }
    };