angularjs图片上传后不刷新的解决办法
刚接触angularjs在使用的过程中遇到这个问题
首先我们的图片地址是根据ID来获取的,所以用了指令来完成图片的绑定
.directive("cImg", ['appUrl', function (appUrl) {
return {
restrict: 'A',
link: function (scope, element, attrs) {
var url = appUrl+ "/GetImgUrl";
var para = { id: attrs.id};
scope.baseService.post(url, para, function (data) {
$(element).attr("src", data.d);
});
}
};
}])
<img c-img id="{{id}}" width="200" height="120" alt="">
但是这样的话上传图片后如果不刷新页面的话图片地址是不会更新的,解决方法是用一个$scope变量来记录是否显示图片,这样在更新这个变量后就会刷新图片了
<img ng-if="IsShowImg" c-img id="{{id}}" width="200" height="120" alt="">
function () {
var url = url+ "/up_load";
//上传之前设置为false 隐藏图片
$scope.IsShowImg=false;
$scope.baseService.post(url, {}, function (data) {
//上传成功后显示图片
$scope.IsShowImg = true;
});
}
angularjs图片上传后不刷新的解决办法的更多相关文章
- SpringBoot集成百度UEditor图片上传后直接访问404解决办法
SpringBoot项目上传图片一般是上传至远程服务器存储,开发过程中可能会上传至当前项目的某个静态目录中,此时就会遇到这个问题,文件在上传之后直接访问并不能被访问到,必须重新加载项目. 首先分析一下 ...
- from表单文件上传后页面跳转解决办法
from表单上传文件,路径跳转后,又不能转发回来. 本人的一个解决办法是.返回一段html代码,浏览器解析后后退一步,回到原来的页面并刷新. return "<html>< ...
- angularjs图片上传和预览 base64
angularjs图片上传和预览 思路是从file中读取base64 Module.controller('controlName', ['$scope', '$http', function($sc ...
- 分离与继承的思想实现图片上传后的预览功能:ImageUploadView
本文要介绍的是网页中常见的图片上传后直接在页面生成小图预览的实现思路,考虑到该功能有一定的适用性,于是把相关的逻辑封装成了一个ImageUploadView组件,实际使用效果可查看下一段的git效果图 ...
- 改变wordpress图片上传后的压缩质量
WordPress 在图片上传后会默认压缩图片质量为原来的 90%,这样做的好处可以极大的加快页面的载入速度与缩小图片大小所占服务器空间. 如果希望 100% 原质量怎么办呢?如何禁止 WordPre ...
- django实现图片上传后自动修改尺寸并保存修改后的图到数据库和本地文件系统
图片上传首先要是设置settings.py文件(与静态文件设置类似) MEDIA_ROOT = os.path.join(BASE_DIR,'media')MEDIA_URL = '/media/' ...
- js实现图片上传后即时预览
//关于FileReader对象 http://blog.csdn.net/zk437092645/article/details/8745647 <!DOCTYPE html> < ...
- iOS图片上传后被旋转的问题
最近用PHP做了一个图片合成程序,前端是通过HTML的file input选取自定图片,POST到php后台调整尺寸后与事先准备好的背景图进行合成. 通过测试发现,上传后的自定图片有的被旋转了,有的是 ...
- Android webview 上传文件不调用openFileChooser解决办法
html页面带有图片上传功能,关于使用openFileChooser方法去选择图片,并且在onActivityResult方法里面设置返回的图片url文件路径,网上有很多,再次不再赘述. 实践中发现, ...
随机推荐
- SVN提交忽略*.class、.classpath、.mymetadata、.project、.settings、.myeclipse和其他非版本控制文件
1.忽略*.class 在TortoiseSVN -->setting(设定)--规设置 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQveHVrZTY ...
- HQL语句大全
第 15 章 HQL: Hibernate查询语言 Hibernate配备了一种很强大的查询语言,这样的语言看上去很像SQL.可是不要被语法结构 上的类似所迷惑,HQL是很有意识的被设计为全然面向对象 ...
- easyui datagrid datagrid-filter bug
问题描述:空字符串.数字过滤 过滤异常 修改js源码: $.fn.datagrid.defaults.operators = { nofilter: { text: 'No Filter' }, co ...
- javascript如何解析json对javascript如何解析json对象并动态赋值到select列表象并动态赋值到select列表
原文 javascript如何解析json对象并动态赋值到select列表 JSON(JavaScriptObject Notation)一种简单的数据格式,比xml更轻巧.JSON是JavaScri ...
- C#修改用户名
string strCmdText; strCmdText = "useraccount where name='" + 旧密码 + "' rename " + ...
- OCP-1Z0-051-题目解析-第12题
12. You need to produce a report where each customer's credit limit has been incremented by $1000. I ...
- 自己编译的openwrt在开机时一直打印jffs2_scan_eraseblock(): Magic bitmask 0x1985 not found...的错误提示
具体的输入信息是这样的. uboot> http Link down: eth0 Ethernet mode (duplex/speed): / Mbps HTTP server is star ...
- 《Visual Studio Magazine》2013年读者选择奖—界面框架类
好消息!2013 Visual Studio Magazine读者选择奖已经正式揭晓了!据了解,截至今年此奖项已经评选了21次,非常值得.NET开发人员信赖和参考.此次评选共有400多个产品角逐28个 ...
- Re-installation failed due to different application signatures.的解决方案
有时在安装不同版本apk文件时会出现Re-installation failed due to different application signatures.这样的提示 主要原因是安装的apk程序 ...
- 使用Castle扩展Ibatis.Net,面向接口编程-更优雅的代码
使用Ibatis.Net做项目半年了,甚是喜欢,感觉确实是个简单.轻巧的O/R Mapping框架,特别是将Sql配置在Xml文件中,相当于直接将Dao层抽离了出来. 本文假定读者对Ibatis.Ne ...