angularJs图片上传

1    功能需求
花几天时间做了一个上传四张图片的功能，一个字段对应一张图片，效果如图所示：
 
1.1    前台页面代码
1.1.1    Html
 
File控件：选择图片
Hidden:存储图片路径，传递给后台保存到数据库
createExteriorPicture1_preview层：预览图层
createExteriorPicture1_preview_large层：放大图片
1.1.2    Css
<style>
    .pic_div {
        display: none;
        position: relative;
    }

    .pic_clear {
        position: absolute;
        right: 115px;
        color: red;
    }

    /*图片放大遮罩层*/
    .mask {
        display: none;
    }

    .mask-box {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 80;
        opacity: 0.5;
        background: #000;
    }

    .big-pic-wrap {
        position: fixed;
        top: 50%;
        left: 50%;
        margin-left: -300px;
        margin-top: -300px;
        width: 920px;
        height: 620px;
        padding: 10px;
        z-index: 90;
        background: #fff;
    }

    .bigPic {
        width: 900px;
        height: 600px;
    }

    /*关闭大图按钮*/
    .close-pic {
        position: absolute;
        top: -5px;
        right: -5px;
        display: inline-block;
        width: 24px;
        height: 24px;
        cursor: pointer;
        border-radius: 50% !important;
        background: #393A3C;
        text-align: center;
        line-height: 40px;
    }

    .close-pic:hover {