新建页面，使用webuploader上传图片，只把图片链接传给了后台，编辑页面的时候，如何回显？

Question

新建图片的时候，对上传图片的数量做了限制。只能最多上传5张图，并且可以删除图片，重新上传，如下代码
var courseHeadUploaderConfig = {

        auto: true,
        compress: false,
        swf: '/static/vendor/webupload/Uploader.swf',
        server: '/index.php/course/upload',
        fileVal:'head_img',
        pick: courseHeadPicker, // 选择文件的按钮。可选
        accept: {
            title: 'Images',
            extensions: 'jpg,jpeg,png,bmp,gif',
            mimeTypes: 'image/*'
        },
        fileNumLimit: 5,
        fileSingleSizeLimit:300*1024,
        duplicate: true,
        // 如果发现压缩后文件大小比原来还大，则使用原来图片
        // 此属性可能会影响图片自动纠正功能
        noCompressIfLarger: false,
        formData: {
            "_csrf": window._csrf,
            'img_extra':'head_img'
        }
    };
        var courseHeadUploader = WebUploader.create(courseHeadUploaderConfig);
        
        删除图片的代码如下
        
         $headList.on("click", ".btn-remove", function () {
        var Id = $(this).parent().attr("id");
        //删除该图片
        courseHeadUploader.removeFile(courseHeadUploader.getFile(Id, true));
        $(this).parent().remove();
    })

但是编辑页面的时候，后台直接给了图片链接，上传的时候还会生存新的图片，并且使用上面删除方法进行删除会报错，

courseHeadUploader.on('uploadSuccess', function (file, response) {

        indexVue.model.head_img.push(response.data);
        if (!response.error_code) {
            var $li = $(
                    '<div  id="' + file.id + '" class="file-item thumbnail">' +
                    '<img src=' + response.data + '>' +
                    '<a href="javascript:;" class="glyphicon glyphicon-remove btn-remove"></a>' +
                    '</div>'
                ),
                $img = $li.find('img');
            $headList.append($li);
        } else {
            $.alert(response.msg, "", function () {
            });
        }
        console.log(response);
    });