求解答angular js自定义控件赋值的问题?

/**

  • 自定义上传图片
    */

app.directive('uploadImage', function() { 
    return { 
        restrict : 'AE', 
        templateUrl : 'component/upload/upload-img.html', 
        replace : true,
        scope : {
            upLoadCover : "@",
            url : "=url"
        },
        link : function(scope, element, attrs)
        {
            scope.upLoadCover = consts.DEFAULT_UP_IMAGE;
            
            scope.imgUpload = function(files)
            {
                $progress.show("图片正在上传中...");
                
                var reader = new FileReader();
                reader.readAsDataURL(files[0]);
                
                reader.onload = function(evt)
                {
                    scope.$apply(function(){
                        scope.upLoadCover = evt.target.result;
                    });
                }
                
                var xhr = new XMLHttpRequest();
                var data = new FormData();
                data.append("file", files[0]);
                xhr.open("post",api.API_UPLOAD,true);
                xhr.send(data);          
                
                xhr.onload = function (){
                    var tex = xhr.responseText;    
                    var dataUrl = JSON.parse(tex).data.file[0].url;    
                    
                    scope.$apply(function(){
                        scope.url = dataUrl;
                        $progress.hide();
                    });
                };         
            }
        }
    }; 
}); 

自定义控件的Template

<form method="post" enctype="multipart/form-data" action="">
    <div class="add-up-load-img">
        <i class="cover" style="background-image: url({{upLoadCover}});"></i>
    </div>
    <div class="add-up-load-btn">
        <img src="assets/images/public/plus.png" />
        <input type="file" name="file" onchange="angular.element(this).scope().imgUpload(this.files)"/>
    </div>    
</form>

代码中scope.upLoadCover = consts.DEFAULT_UP_IMAGE;
这一句是给自定义控件附一个默认背景,上传后替换默认背景,如图

clipboard.png

但是点击修改图片时,要给图片赋值,如何做到呢?

阅读 2.1k
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题