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文件路径,网上有很多,再次不再赘述. 实践中发现, ...
随机推荐
- JAVA简单Swing图形界面应用演示样例
JAVA简单Swing图形界面应用演示样例 package org.rui.hello; import javax.swing.JFrame; /** * 简单的swing窗体 * @author l ...
- UIAppDelegate介绍
#import "GLAppDelegate.h" @implementation GLAppDelegate // 当应用程序启动完毕的时候就会调用(系统自动调用) - (BOO ...
- linux简单的数据包捕获分析
有时我们会遇到一些问题,需要捕捉数据包分析,当手头有没有专业的抓图工具,您可以使用tcpdump相反,看看(一般版本附带这个工具) 比如,我们要分析eth0与接口192.168.7.188 这个对象I ...
- addEventListener
addEventListener addEventListener-开始 前面零散地写了些关于 addEventListener 的内容,觉得比较散,有些地方可能也说得不够清楚明白,所以决定以连载的形 ...
- WaitHandle、AutoResetEvent、ManualResetEvent
多线程中的锁系统(三)-WaitHandle.AutoResetEvent.ManualResetEvent 介绍 本章主要说下基于内核模式构造的线程同步方式,事件,信号量. 目录 一:理论 二:Wa ...
- HTML5 五彩圆环Loading加载动画实现教程
原文:HTML5 五彩圆环Loading加载动画实现教程 今天我们要来介绍一款效果很特别的HTML5 Loading加载动画,不像其他的Loading动画,这款Loading动画颜色很丰富,并且在转圈 ...
- Java阅读word程序说明文件
完成office文件操作可以帮助apache.poi包(我用poi-3.10-FINAL),导入对应的jar包(最好所有导入) 以下的程序演示了一些操作word的过程,具体的函数功能能够查看此包的官方 ...
- Java 实现迭代器(Iterator)模式
类图 /** * 自己定义集合接口, 相似java.util.Collection * 用于数据存储 * @author stone * */ public interface ICollection ...
- HDU 2064 汉诺塔III
汉诺塔III Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total Submis ...
- IOS开发苹果官方Sample Code及下载地址
IOS开发苹果官方Sample Code及下载地址 在线浏览地址:https://developer.apple.com/library/ios/navigation/#section=Resourc ...